Angular学习笔记(一)（属性绑定）

1、创建一个名为myComName的组件：

ng g component myComName

2、绑定数据

控制类定义属性：

msg='这是我的消息'

.html页面中获取上面的msg内容

{{msg}}

3、绑定属性

<div [title]="msg"></div>

4、绑定html

控制类定义属性

html = '<h4>我是在控制类中定义哈的html</h4>';

html中调用[innerHTML]属性

<div [innerHTML]="html">

</div>

5、做简单的运算

直接在模板文件中使用

1+2={{1+2}}

6、数据循环

控制类中定义数组：

heros = ['111', '12222', '33333']; // 定义数组

模板文件中调用

<ul>
  <li *ngFor="let hero of heros">
    {{ hero }}
  </li>
</ul>

显示数据的索引页很简单，如下：

<ul>
  <li *ngFor="let hero of heros;let key=index;">
    {{key}}---------{{ hero }}
  </li>
</ul>