Angular常用指令说明

Angular常用指令说明:
1.插值表达式{{}}–文本绑定
例 :

{{title}}

2.HTML绑定
例:

*<div [innerHTML]="xxx"></div>*

3.数据遁环
3.1写法一:

<ul>
	<li *ngFor="变量名 of list"> </li>
	</ul>

如果想要获得下标值，可以这样

<ul>
<li *ngFor="let 变量名 of list: list i = index>
	{{i}}
</li>
</ul>

3.2写法二：

<ul>
<li template="ngFor let 变量名 of list">
</li>
</ul>

4.条件判断 *ngif:
写法一:

<p *ngIf = "list.length<5">显示条件<./p>

写法二:

<p template = "ngif list.length<5">显示条件</p>

5.事件的执行:

<button (click)="方法名（）"></button>

6.属性的绑定:

[xxx]="xxxx"

7.双向数据绑定

< input [(ngModel)] = "value">
{{value}}

重点一定要在项目中引入FormsModule模块

import { FormsModule } from '@angular/froms';
@NgModule({
declarations:[
appComponent,
HeaderComponent,
FooterComponent,
NewsComponent
],
imports:[
BrowserModule,
FormsModule
],
providers:[],
bootstrap:[AppComponent]
}]
export class AppModule{ }