0

我有一个非常简单的 Ionic 页面。此页面显示 Reduxstate 的状态。在此页面中，我有一个按钮，我可以通过该按钮进入另一个页面，在那里我可以更改状态并返回。如果我回来，视图将不会更新。我花了很长时间研究为什么这不起作用。不幸的是，没有成功。

零件

export class AssetDetailTechnicPage {
    @select(['asset', 'asset'])
    asset$: Observable<Asset>;
}

模板

<ion-content *ngIf="asset$ | async as asset">
    <!--Leistung für Systemeinheit-->
    <ion-card *ngIf="asset.assetSubKind.assetKindId === 2 && (asset.totalMemory || asset.hardDiskCapacity || asset.hardDiskTyp || asset.opticalDriveType
    || asset.bios || asset.displaySize || asset.cpu || asset.gpu)">
        <ion-card-header>
            <ion-icon name="build"></ion-icon> {{'PERFORMANCE' | translate}}
        </ion-card-header>
        <ion-card-content>
            <ion-label color="primary" *ngIf="asset.totalMemory">
                {{'MAIN_MEMORY' | translate}}:
            </ion-label> {{asset.totalMemory}}
            <ion-label color="primary" *ngIf="asset.hardDiskCapacity">
                {{'HDD_CAPACITY' | translate}}:
            </ion-label> {{asset.hardDiskCapacity}}
            <ion-label color="primary" *ngIf="asset.hardDiskTyp">
                {{'HDD_TYPE' | translate}}:
            </ion-label> {{asset.hardDiskTyp}}
            <ion-label color="primary" *ngIf="asset.opticalDriveType">


            {{'OPTICAL_DRIVE' | translate}}:
                </ion-label> {{asset.opticalDriveType}}
...... something similar goes on

尝试找出：

  • 该页面位于 Ionic 超级选项卡组件中。我首先认为这与插件离子超级标签有关。我把它拿出来并没有帮助

  • 也许它与redux有关？也许状态没有改变？也许这不会发生在角区？这就是为什么我把它全部重写了一点

    @select(['asset', 'asset'])
asset$: Observable<Asset>;
asset: Asset;

constructor(private navCtrl: NavController) {
    this.asset$.subscribe(asset => {
        this.asset = asset;
        console.log(NgZone.isInAngularZone());
    });
}

editAsset() {
    this.navCtrl.push(CreateAssetPage, {
        edit: true
    });
}

    所有更改都被接受并存储在组件中。控制台输出始终为真（始终在 Angular 区域中）。为什么视图没有更新？

  • 上次我尝试手动触发 changeDetection ，但这导致了错误。

    constructor(private navCtrl: NavController,  private changeRef: ChangeDetectorRef) {
    this.asset$.subscribe(asset => {
        this.asset = asset;
        console.log(NgZone.isInAngularZone());
        if(this.asset) {
            this.changeRef.detectChanges();
        }
    });
}
4

1 回答 1

0

如果我将 if 语句从内容中取出，一切正常......无论如何

<ng-container *ngIf="asset$ | async as asset">
    <ion-content>
      ....
于 2018-10-11T06:34:34.823 回答