javascript - 更改对象阵列后， ionic 选择选项不会刷新

Question

我有 2 个 ionic 选择 当第一个更改时，第二个应该更新

我已经在第一个上设置了(ngModelChange) 我更改了第二个中显示的元素数组 但这行不通 请帮忙

<ion-item text-right>
    <ion-select
            interface="alert"
            [interfaceOptions]="receiveDatesOptions"
            [compareWith]="compareWithDates"
            [(ngModel)]="receiveDate"
            (ngModelChange)="changedReceiveDate()"
            [selectedText]="receiveDate.datePersian">
        <ion-select-option
                *ngFor="let date of currentReceiveDates"
                [value]="date">{{date.datePersian}}
        </ion-select-option>
    </ion-select>
</ion-item>


<ion-item text-right>
    <ion-select
            interface="alert"
            (ngModelChange)="changeDeliveredDate()"
            [interfaceOptions]="deliverDatesOptions"
            [compareWith]="compareWithDates"
            [(ngModel)]="deliverDate"
            [selectedText]="deliverDate.datePersian">
        <ion-select-option
                *ngFor="let date of currentDeliverDates"
                [value]="date">{{date.datePersian}}
        </ion-select-option>
    </ion-select>
</ion-item>

    changedReceiveDate() {
        this.receiveTimes = this.receiveDate.parts;
        this.currentDeliverDates.splice(0, 2);
        // even if set it to an empty array it wont help
    }

我预计第二个选择的项目会越来越少，但我不会改变 即使我将其设置为空数组

Answer 1

检查此链接。我想你也有同样的问题。

https://forum.ionicframework.com/t/ionic-4-ion-select-option-underlying-list-not-updating/158251

https://github.com/ionic-team/ionic/issues/16453

现在尝试更改您的第二个选择项目代码，使其正常工作。

<ion-item text-right *ngIf="refreshed">
     <ion-select
        interface="alert"
        (ngModelChange)="changeDeliveredDate()"
        [interfaceOptions]="deliverDatesOptions"
        [compareWith]="compareWithDates"
        [(ngModel)]="deliverDate"
        [selectedText]="deliverDate.datePersian">
    <ion-select-option
            *ngFor="let date of currentDeliverDates"
            [value]="date">{{date.datePersian}}
    </ion-select-option>
   </ion-select>
</ion-item>

changedReceiveDate() {
    this.refreshed = false;
    this.receiveTimes = this.receiveDate.parts;
    this.currentDeliverDates.splice(0, 2);
    setTimeout(()=>{
        this.refreshed = true;
    })

}