This project was generated with Angular CLI version 1.6.5.

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

• $ ng new project-name

• revise index.html(project-name/src/index.html) add"Loding...."

• $ ng serve and navigate to http://localhost:4200/

• edit app.component.html(project-name/src/app/app.component.html)

• update title in project-name/src/app/app.component.ts

• add{{}}in HTML and Eg: in export class AppComponent {} add 1.sushiStyle: string = "Sushi Styles";(single time insert) 2.after export class AppComponent {} add class(if we need add multiple objects should build a class) export class Styles { public done: boolean = false; constructor(public description: string) { } } firstStyle: Styles = new Styles("Chirashi-zushi (ちらし寿司, scattered sushi)");(use class) }

• Build app/models folder, touch app/models/sushi.model.ts ,puts class in this file. Meanwhile, import { Styles } from './models/sushi.model'; on app/app.component.ts( every time create a new model for some specific object,eg,fishType, touch a new model file in models and import this file to top of app.component.ts)

• where to display the dynamic description or price of our fantastic sushi content? use{{}}. eg,

• {{sushiStyle.description}}/{{sushiStyle.price}}
, add*in front of ngFor.

• One-way data binding(add button, data flows in one direction) further explaination please refer to https://www.learnhowtoprogram.com/javascript/angular/event-bindings 1, eg add this event-binding in HTML element "<button "here">" (click)="placeSushiStyle()" and edit template statement(methods()) in export class AppComponent

• property binding(data flows in the opposite direction)

• two way binding( data flows in both directions) 1, if will take value by form, add import { FormsModule } from '@angular/forms'; in app.module.ts add FormsModule, in "imports:" of app.module.ts 2, [(ngModel)]="selectedTask.description" as

• Dynamic Edit Form

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the -prod flag for a production build.

Run ng test to execute the unit tests via Karma.

Run ng e2e to execute the end-to-end tests via Protractor.

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.