angular4.0 常用指令

angular 4.0 常用指令

插值表达式 : 渲染数据      {{}}

判断   *ngIf=""   
           条件可以为 
              变量 : isShow = true      *ngIf="isShow"
              表达式 : a ? 1 : 0
              布尔值 : true  false
    
循环   *ngFor=“ let item of data; let i = index ”

样式   [ngStyle]="{'color': enterpriseBefore ? '#686eec' : '#b9baba' }"    可用表达式

       [ngStyle]="{'background-image': 'url('+image+')'}"  可用拼接的方式

类名   [ngClass]="{'class': true}"

占整个宽度的比值  fxFlex

点击事件：   (click)="goBack()"

路由    [routerLink]="['/products', productId]"    
  [routerLink]="'/website/pro-build-bid-detail'"     [queryParams]="{id: item.id, projectId:  item.id}"

布局

   排列方向 fxLayout :
               row       一行
               column    列
               wrap     多行
               fxLayout.xs="column"  :  在 手机端  ‘screen and (max-width: 599px)’   以列 显示 
               
    排列方式  fxLayoutWrap       
                            排板方式为多行方式
                            <div **fxLayoutWrap**> </div>
                            
    对齐方式  fxLayoutAlign : 
      
                 水平方向：
                     none
                     start                     在开始位置
                     center                    中间位置
                     end                       在结束位置
                     space-between             在分别在两边位置
                     space-around              环绕周围
                     space-evenly              空间均匀 

                垂直方向：
                       none
                       start                        在最上面
                       center                       在中间
                       end                          在最下面
                       stretch                      平铺