5

テンプレートに検索バーがindex.htmlあり、一部のページで非表示にする必要があります。と を使用ui-routerして$stateいます。

これを機能させる唯一の方法は、$rootscopeすべてのコントローラーに注入するか、必要に応じてオンng-hide: trueまたはfalseオフにすることです。(私は本当に 1 つまたは 2 つのページを非表示にする必要があります)

すべてのコントローラーが に依存して注入されるようになったため、これが正しい方法だとは思いません$rootscope。

これを行う別の方法はありますか？

4

6 に答える 6

1

in 式を使用して、テンプレートから $rootScope にアクセスできます$root。お気に入り：

<div ng-show="$root.appSettings.flag">
    <span>Hello!</span>
</div>
于 2015-12-10T17:22:02.817 に答える
0

アプリのrun関数にオブジェクトを登録しました

.run([ '$rootScope', function ($rootScope) {
  $rootScope.searchBar = { value: true };
}])

次に、スコープを使用して値を変更しました。これにより、すべてのコントローラーへの $rootscope の追加が停止します

$scope.searchBar.value = false;

index.html ページに値を設定します

<div ng-show="searchBar.value" ng-include src="'app/shared/search.html'"></div>
于 2015-12-15T13:25:15.337 に答える
0

では、抽象的な状態ui-routerを使用して階層を作成できます。このようにして、親ルート ウィッチには検索バー ビューがあり、別の親ルートにはありません。実際のすべてのルートはこれら 2 つから継承でき、完了です。

このようなもの

$stateProvider
.state('rootLayout', {
    abstract: true,
    // Note: abstract still needs a ui-view for its children to populate.
    // You can simply add it inline here.
    template: '<div><div ui-view="topbar"></div><div ui-view></div></div>'
})
.state('searchbarLayout', {
    abstract: true,
    views: {
        '@rootLayout': { 
             // Note: abstract still needs a ui-view for its children to populate.
             // You can simply add it inline here.
             template: '<div ui-view></div>'
        },
        'topbar@rootLayout': { 
             template: '<input type="search" />'
        },
    }    
});
于 2015-12-10T15:26:26.287 に答える
0

例えば

<div ng-controller="SearchCtrl">
<div ng-if="show">
...
</div>
</div>

app.controller('SearchCtrl', ['$state', '$scope', function($state, $scope) {
    $scope.show = !$state.is('someState1') && !$state.is('someState2');
}

これは良いスタイルではありませんが、簡単に機能します。

于 2015-12-10T13:52:40.533 に答える