20

ページナビゲーションメニューを表示するコントローラーがあります。メニューには一連の項目があり、各項目にはキャプションとリンクがあります。また、関連するページが現在表示されているかどうかを示すフラグを各アイテムに設定します。

module.controller('MenuContr', [
    /******/ '$scope', '$location',
    function ($scope,   $location) {
        $scope.items = [
            {text: 'page 0',
             href: '#/page-0',
             current: $location.path() === '/page-0'},
            {text: 'page 1',
             href: '#/page-1',
             current: $location.path() === '/page-1'}
        ];

私のテンプレートで：

<ul class="menu" ng-controller="MenuContr" ng-cloak>
  <li ng-repeat="item in items" ng-switch on="item.current">
    <span class="current" ng-switch-when="true">{{item.text}}</span>
    <a ng-switch-default ng-href="{{item.href}}">{{item.text}}</a>
  </li>
</ul>

場所が変わったときにメニューを更新できるようにする必要がありますが、どのように行われますか？購読できるイベントはありますか？

編集：このコントローラーは、私のルートで定義されているコントローラーに加えて使用され、上記のテンプレートは、ng-viewディレクティブを含む要素の上に配置されます。

4

2 に答える 2

21

私自身の質問に答えるために、私のMenuContr：

        $scope.$on('$routeChangeSuccess', function () {
            var items = $scope.items;
            var path = $location.path();

            for (var i = 0; i < items.length; i++) {
                var item = items[i];
                var href = item['href'];
                item['current'] = !!href && href.substring(1) === path;
            }
        });
于 2012-11-17T00:30:02.680 に答える
0

ルート変更時に同じコントローラーに来ていますか？AppsModule.configの$routeProviderで定義した方法ですか？追加のフィルタリングが必要な場合は、$routeParamsを同じコントローラーに渡すことができます。

コントローラの起動時にオブジェクトを初期化しました。したがって、リンクが変更されると、同じコントローラーが呼び出され、他のことを行う必要はありません。選択したルートに基づいて、アイテムが更新されます。

于 2012-11-17T11:18:29.337 に答える