如何使用 *ngSwitchWhen 打字?
How can I use *ngSwitchWhen to typescript?
我在做Ionic2 + Angular2,我想用segment,所以我用了ngSwitchWhen
,但是不行。发生错误。
我该如何使用它?为什么它不起作用?
这是错误信息。
<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>
你可以试试这个:
请将键盘 'ngSwitchWhen' 更改为 '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>
加入你的@Component.ts:
public data:any[]=[];
data.push({type:'light'},{type:'sensor'});
我在做Ionic2 + Angular2,我想用segment,所以我用了ngSwitchWhen
,但是不行。发生错误。
我该如何使用它?为什么它不起作用?
这是错误信息。
<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>
你可以试试这个:
请将键盘 'ngSwitchWhen' 更改为 '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>
加入你的@Component.ts:
public data:any[]=[];
data.push({type:'light'},{type:'sensor'});