1. ngStyle： 允许你根据组件类中的属性动态设置元素的内联样式。
<div [ngStyle]="{'color': textColor, 'font-size': fontSize}">动态设置的样式</div>
2. ngClass： 允许你根据组件类中的属性动态设置元素的 CSS 类。
<div [ngClass]="{'active': isActive, 'disabled': isDisabled}">动态设置的类</div>
3. ngModel： 用于实现双向数据绑定，将表单元素的值与组件类中的属性关联。
<input [(ngModel)]="username" />
4. ngIf： 根据组件类中的条件判断语句决定是否渲染或移除元素。
<div *ngIf="isConditionTrue">内容将在条件为真时显示</div>
5. ngSwitch： 根据组件类中的表达式值选择不同的模板。
<div [ngSwitch]="value">
<div *ngSwitchCase="'case1'">条件为case1时显示的内容</div>
<div *ngSwitchCase="'case2'">条件为case2时显示的内容</div>
<div *ngSwitchDefault>默认情况下显示的内容</div>
</div>
这些属性型指令可以在 Angular 应用程序中实现更灵活的动态绑定和交互性。通过在组件类中定义相应的属性，你可以根据这些属性的值来改变模板中的元素行为和样式。
转载请注明出处：http://www.pingtaimeng.com/article/detail/4931/Angular