ngIf 与 BehaviorSubject 改变元素的顺序

Question

我的服务中有两个这样的 BehaviorSubject 值，

public showExportCsvModal = new BehaviorSubject<boolean>(false);
public showDownloadModal = new BehaviorSubject<boolean>(false);

而我的html代码是这样的，

    <p *ngIf="stateService.showExportCsvModal | async">
        {{'exportModal.severalMinutesToComplete' | translate }}
    </p>
    
    <p *ngIf="stateService.showDownloadModal | async">
        {{ 'exportModal.severalMinutesToCompleteDownload' | translate }}
    </p>

    <p>
        {{'exportModal.downloadTheFinishedFileFrom' | translate }}
    </p>

问题是第三个 p 标签是这样显示在顶部的，

如何评估 ngIf 语句，以便第一个 p 标签先显示，然后显示普通标签？任何帮助将不胜感激。

Answer 1

将{{'exportModal.downloadTheFinishedFileFrom' | translate }}添加到每个<p *ngIf>

<p *ngIf="stateService.showExportCsvModal | async">
    {{'exportModal.severalMinutesToComplete' | translate }}
    {{'exportModal.downloadTheFinishedFileFrom' | translate }}
</p>

<p *ngIf="stateService.showDownloadModal | async">
    {{ 'exportModal.severalMinutesToCompleteDownload' | translate }}
    {{'exportModal.downloadTheFinishedFileFrom' | translate }}
</p>

ngIf 与 BehaviorSubject 改变元素的顺序

ngIf with a BehaviorSubject changes the order of elements

typescript

behaviorsubject

angular-ng-if

angular