5

AngularJS のヘルプをもう一度お願いします。レイアウト (マスター) ページが左側のナビゲーション バー、中央のコンテンツ、右側のアイテム リスト バーの 3 つのセクションに分割されている SPA を構築しています。ホームページをロードすると右側のアイテム リストが非表示になりますが、残りの画面では表示されるはずです。homeController に $rootScope 変数を作成し、ロケーション パスに基づいて値を「true」に設定し、テンプレートでその変数を使用して値を ngHide に設定しました。SPA を使用しているときに別のページに移動すると、左右のバーが再度読み込まれず、新しいビューである中央のコンテンツのみが読み込まれます。データを新しいビューのテンプレートに送信しているコントローラーに新しいビューをロードしている間、homeController で作成した $rootScope 変数を「false」ですが、右のバーはまだ表示されていません。補間によって値が「true」に更新されましたが、ng-hidden クラスがまだオンになっていることがわかりました。どんな提案でも大歓迎です。

レイアウト ページからのマークアップ:

<aside class="right_bar" ng-hide="{{$root.show}}">
        <div class="my-list"><span class="f3">My Cart</span><div class=""><span class="list-count">0</span></div></div><div class="list-item"><ul></ul></div>
    </aside>  

homeController コード:

    function getHomeConfigsCtrl($http, $location, $rootScope) {

     $rootScope.show = false;

    var loc = $location.path();

    if (loc === '/Home/Index' || loc ==='')
    {
        $rootScope.show = true;
    }
   }

カテゴリ コントローラ コード: ここで $rootScope 変数の値をリセットしています

function getAllCategoryDetails($routeParams,$rootScope) {
    $rootScope.show = false;
}
4

1 に答える 1

18

提示されたコードを機能させるために知っておく必要があるAngularについての2つのこと:

  • {{}}in ng ディレクティブを使用して値を補間する必要はありません。代わりに を使用してng-hide="showCart"ください。

  • すべてのコントローラーが同じAngularアプリケーション内にあると仮定すると、同じアプリケーション内のすべてのスコープは同じルートから継承されます。つまり、 $rootScope で定義したものはすべて、すべての子スコープで利用できます。アプリケーションの任意のビュー内から $rootScope.x にアクセスするには、{{x}} または、ディレクティブ内で使用している場合は、次のようにする必要があります。

    <aside class="right_bar" ng-hide="showCart">

    これは現在のスコープを探します。showCart がある場合はそれを使用し、そうでない場合は $rootScope.showCart をフェッチします。

于 2015-01-02T21:18:13.697 に答える