angular.js(2) 数据的渲染

angular-（2）

把数据添加到组件中

eg：
ng generate component user-item
在user-item.component.ts中。

• 定义 name：string；//定义name属性
• 在构造函数里写入constructor(){ this.name = 'Alice'}
• 在组件中渲染的时候用双花括号法。

  {{name}}

使用数组添加到组件中

eg:

• 定义数组 names:string[]

• 构造函数 constructor(){ this.name = ['Ari','Carlos','Felipe','Nate']}

• 渲染的时候需要用到ngFor

    
  
    
  {{name}}
    
  

在组件中套用自定义组件

@Input注解

在user-item.compnent.ts中接收输入。
@Input() name；string;
在user-list.component.html

注意这里的let name 和下面的 “name” 需保持一致性