2017-11-03 38 views
-1

Ionic2 + Angular2에서 작업 중이므로 세그먼트를 사용하려고하므로 ngSwitchWhen을 사용했지만 작동하지 않습니다. 에러 발생됨.* ngSwitch를 타이프 ​​스크립트로 사용하려면 어떻게해야합니까?

어떻게 사용하나요? 왜 효과가 없습니까?

다음은 오류 메시지입니다.

<ion-toolbar> 
    <ion-segment [(ngModel)]="menuSelect" color="important"> 
     <ion-segment-button value="light"> 
      Light 
     </ion-segment-button> 
     <ion-segment-button value="sensor"> 
      Sensor 
     </ion-segment-button> 
    </ion-segment> 
</ion-toolbar> 

<ion-content [ngSwitch]="menuSelect"> 
    <!--func+ - light--> 
    <ion-item *ngSwitchWhen="'light'"> 
     <ion-list> 
      <ion-list-header> 
       <ion-label>On/Off</ion-label> 
       <ion-toggle (click)="toggleLight()"></ion-toggle> 
      </ion-list-header> 
     </ion-list> 

     <!--light-off--> 
     <div [hidden]="lightOn"> 
      <div class="light-off">Please turn on the light.</div> 
     </div> 

     <!--light-on--> 
     <div [hidden]="!lightOn"> 
      <ion-list> 
       <ion-list-header class="title"> 
        Color 
       </ion-list-header> 
      </ion-list> 
      <ion-list> 
       <ion-list-header class="title"> 
        Brightness 
        <ion-badge>{{brightness}}</ion-badge> 
       </ion-list-header> 
       <ion-item> 
        <ion-range min="0" max="5" step="1" snaps="true" [(ngModel)]="brightness"> 
         <ion-icon range-left small name="sunny"></ion-icon> 
         <ion-icon range-right name="sunny"></ion-icon> 
        </ion-range> 
       </ion-item> 
      </ion-list> 
     </div> 
    </ion-item> 

    <!--func+ - sensor--> 
    <ion-item *ngSwitchWhen="'sensor'"> 
     <ion-list> 
      <ion-list-header> 
       <ion-label>On/Off</ion-label> 
      </ion-list-header> 
     </ion-list> 
    </ion-item> 
</ion-content> 
+0

https://angular.io/api/common/NgSwitch –

+0

http://idownvotedbecau.se/imageofanexception/ – stealththeninja

답변

1

당신이를 위해 시도 할 수 있습니다에 'ngSwitchWhen을'

를하고 키보드를 CHAGE하십시오 'ngSwitch'은 @ Component.Html에서

<div [ngSwitch]="data.type"> 
    <div *ngSwitchDefault>FORM 1</div> 
    <div *ngSwitchCase="'light'">FORM 2</div> 
<div *ngSwitchCase="'sensor'">FORM 2</div> 
</div> 

부업장의 @Compo nent.ts :

public data:any[]=[]; 
data.push({type:'light'},{type:'sensor'});