如何在 Ionic 3/ Angular 2 中使用 ng-cloak？

Question

我有一个带搜索功能的 Ionic 3 应用程序。当应用搜索没有结果时，下面的卡片很好地显示：

  <ion-card *ngIf="pages?.length == 0" ng-cloak>
    <ion-card-content>
      No pages found...
    </ion-card-content>
  </ion-card>

但是当页面加载时，它在屏幕上闪烁:( 所以我使用 ng-cloak 在加载时隐藏。我添加了这个 CSS:

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

在app.scss

但是当页面加载时，离子卡在屏幕上闪烁...

Answer 1

Angular不支持ngCloak。您可以在 angular -

中使用此方法

HTML

 <ion-card *ngIf="showNotFound">
    <ion-card-content>
      No pages found...
    </ion-card-content>
  </ion-card>

TS

showNotFound: boolean = false

    search() {
        this.showNotFound = false;
        this.api.search(queryText).subscribe(data => {
                this.results = data;
                try {
                    if (!this.results.length) {
                        this.showNotFound = true;
                    }
                } catch (exception) {
                    console.error(exception);
                }
            }
        }

如何在 Ionic 3/ Angular 2 中使用 ng-cloak？

How to use ng-cloak in Ionic 3/ Angular 2?

ionic3

angular