GDD2018大会PPT资料Progressive Web Apps with Angular - with Chinese最新完美版.pdfVIP

Progressive Web Apps 
 with Angular Angular
 
 December, 2016 Angular exists to make Angular building applications . with the web easy. @stephenfluin Angular Everywhere @stephenfluin Agenda 1.App Shell Generation App Shell 2.Service Worker 3.Push 4.Live Coding App Shell Generation
 App Shell Universal Universal AppShellModule import {AppShellModule} from @angular/app-shell; import {NgModule} from @angular/core; import {CommonModule} from @angular/common;
 import {RootComponent} from ./root; import {WeatherModule} from ./weather;
 @NgModule({ bootstrap: [RootComponent], declarations: [ RootComponent, ], imports: [ AppShellModule, CommonModule, WeatherModule, ], }) export class AppModule {} Directives header class=header h1 class=header__titleWeather PWA/h1 button (click)=refresh() id=butRefresh class=headerButton aria-label=Refresh/button button (click)=showPicker() id=butAdd class=headerButton aria-label=Add/button /header
 main class=main *shellNoRender weather-card *ngFor=let city of cities [city]=city/weather-card /main main class=main *shellRender h2Loading.../h2 /main div class=dialog-container [ngClass]=viewState city-picker [cities]=weatherData.allCities (save)=addCity($event) (cancel)=onCancel($event)/city- picker /div Directives header class=header h1 class=header__titleWeather PWA/h1 button (click)=refresh() id=butRefresh class=headerButton aria-label=Refresh/button button (click)=showPick