离子段按钮:动态检查不工作

Question

在我的angular应用程序中，我尝试为一周中的每一天动态生成离子段按钮，然后在今天开始检查。

模板：

<ion-segment class="ion-padding" (ionChange)="onChangeDay($event)">
<div [ngSwitch]="weekday" *ngFor="let weekday of workweek">
<ion-segment-button *ngSwitchCase="workweek[today]" [value]="weekday" checked>{{weekday}}</ion-segment-button>
<ion-segment-button *ngSwitchDefault [value]="weekday">{{weekday}}</ion-segment-button>
</div>

相关ts代码：

public workweek = ['mon', 'tue', 'wed', 'thu', 'fri']; 
public today = new Date().getDay()-1;
onChangeDay(event: Event) {
}

Answer 1

我使用ngModel 解决了它

模板：

<ion-segment class="ion-padding" (ionChange)="onChangeDay($event)" [(ngModel)]="segment">
<ion-segment-button *ngFor="let weekday of workweek; let i = index;" [value]="i"> 
{{weekday}}</ion-segment-button>
</ion-segment>

打字代码：

public workweek = ['mon', 'tue', 'wed', 'thu', 'fri']; 
public today = new Date().getDay()-1;
onChangeDay(event: Event) {
}

Answer 2

<ion-segment value="all">
<ion-segment-button value="all">
<ion-label>All</ion-label>
</ion-segment-button>
<ion-segment-button value="bookable">
<ion-label>Bookable</ion-label>
</ion-segment-button>
</ion-segment>