ng4.x 常用指令

# 1 : *ngFor     ---      数据循环

No 1:*ngFor普通循环

No 2:循环时设置序列号

No 3:template循环数据


<ul>

        <li *ngFor ="let item of list; let key = index">

             {{key} -- {{item}}

       </li>

</ul>


<ul>

      <li  template =" ngFor let item of list2; let key = index">

           {{key} -- {{item.name}}

     </li>

</ul>


# 2 : *ngIf  ---  条件判断


<div *ngIf = "flag">

     flag=true的情况下显示

</div>

<p template="ngIf list.length > 3">数组长度大于三时显示</p>


# 3: *ngSwitchCase  ---  多重选择


<div [ngSwitch] = "answer">

     <p *ngSwitchCase = " 'a' "> A </p>

     <p * ngSwitchCase = " 'b' ">B </p>

    <p *ngSwitchDefault> 请输入正确答案</p>

</div>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容