angular 学习日志

1、创建项目

　　

npm install -g @angular/cli

ng new my-app

cd my-app
ng serve --open  // 或者  npm start

2、生成新模块

ng generate component heroes

3、引入双向绑定模块儿 app.module.ts 中添加 

import { FormsModule } from '@angular/forms'

// @NgModule 中

imports: [
    BrowserModule,
    FormsModule
  ]

4、父组件和子组件的交互

父页面中：

　　

<app-hero-detail [hero]="selectedHero" ></app-hero-detail>

子组件中：

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-hero-detail',
  templateUrl: './hero-detail.component.html',
  styleUrls: ['./hero-detail.component.css']
})
export class HeroDetailComponent implements OnInit {
  @Input() hero
  constructor() {
    console.log('===>',this.hero)
  }

  ngOnInit() {
  }

}

5、生成service

ng generate service hero   //--module=app  限定service 作用的等级