George Kalpakas 65aaffcfe4 docs(service-worker): add example app for SwPush API docs (#32139)
Previously, the `SwPush` API docs were using hard-coded code snippets.

This commit switches to using code snippets from an actual example app,
which ensures that the code shown in the docs will at least continue to
compile successfully.

PR Close #32139
2019-08-27 16:18:53 -07:00

67 lines
1.7 KiB
TypeScript

/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
// tslint:disable: no-duplicate-imports
import {Component, NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {ServiceWorkerModule} from '@angular/service-worker';
// #docregion inject-sw-push
import {SwPush} from '@angular/service-worker';
// #enddocregion inject-sw-push
// tslint:enable: no-duplicate-imports
const PUBLIC_VAPID_KEY_OF_SERVER = '...';
@Component({
selector: 'example-app',
template: 'SW enabled: {{ swPush.isEnabled }}',
})
// #docregion inject-sw-push
export class AppComponent {
constructor(readonly swPush: SwPush) {}
// #enddocregion inject-sw-push
// #docregion subscribe-to-push
private async subscribeToPush() {
try {
const sub = await this.swPush.requestSubscription({
serverPublicKey: PUBLIC_VAPID_KEY_OF_SERVER,
});
// TODO: Send to server.
} catch (err) {
console.error('Could not subscribe due to:', err);
}
}
// #enddocregion subscribe-to-push
private subscribeToNotificationClicks() {
// #docregion subscribe-to-notification-clicks
this.swPush.notificationClicks.subscribe(
({action, notification}) => {
// TODO: Do something in response to notification click.
});
// #enddocregion subscribe-to-notification-clicks
}
// #docregion inject-sw-push
}
// #enddocregion inject-sw-push
@NgModule({
bootstrap: [
AppComponent,
],
declarations: [
AppComponent,
],
imports: [
BrowserModule,
ServiceWorkerModule.register('ngsw-worker.js'),
],
})
export class AppModule {
}