angularjs - ng-cloakとng-showは、画面上の非表示の要素を点滅させます

Question

アイテムのリストが空の場合にのみ表示したいdiv要素があります。だから私は以下を（hamlで）入れました：

  #no-items.ng-cloak{ :ng_show => "items.length <= 0", :ng_cloak => true }

However, even after I've done that the element is still flashing on the screen. Then I saw Angularjs - ng-cloak/ng-show elements blink, but even after adding the following in my CSS, the blink still occurs.

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

Any ideas what I am doing wrong?

Answer 1

上記の ng-cloak CSS がページの先頭にロードされていることを確認します。

これはあなたがする必要があるすべてです：

<div ng-hide="items.length" ng-cloak>no items</div>

サンプルフィドル。

Answer 2

解決策はどれもうまくいきませんでした。私が見つけた唯一の解決策は次のとおりです。

各コントローラーで、以下を追加します。

$scope.$on('$viewContentLoaded', function () {
            $scope.completed = true;
});            

各ビューの html で、最上位の要素に ng-if="completed" を追加します。例えば：

<div ng-if="completed">

注: 問題はfirefoxとui-routerに限定されています。そこでは、ng-cloak は無視され、CSS の回避策はありません。私のために働いた唯一の解決策は、私が上で与えたものです。