web-dev-qa-db-ja.com

UIルーターの条件付きUIビュー？

このかなり些細な問題を解決するための、ハックのように感じない合理的な方法を見つけることはできません。

ゲストがWebサイトのインデックスにアクセスするときにスプラッシュページを表示し、ログインしているユーザーがプロファイルを表示するようにしたいです。各ページには独自のテンプレートとコントローラーがあります。 理想的には、1つのURLに2つの状態がありますであり、どういうわけか、ログインステータスに応じてアクティブな状態を自動的に変更できます。これらのビューは両方とも独自のネストされたビューを持つため、ng-includeは使用できません（私は想定しています）。

私はangularおよびui routerにかなり慣れていないので、問題の簡単な解決策を見落としているかもしれません。

名前付きビューとng-showで実行できますか？

angularjsangular-uiangular-ui-router
38
Ryan Connolly

UIルーターを使用している場合は、3つの状態を作成します。ルート状態と、'/' URL、およびURLのない2つの直接の子孫状態。ルート状態のonEnterで、ユーザーの状態を検出し、それに応じて正しい子状態に移行します。これにより、両方の子状態で同じURLを保持しているように見えますが、別々の構成で状態を分離する必要があります。

53
Nate Abele

templateUrl も関数になるため、ログイン状態を確認して、別のビューを返し、状態設定の一部としてではなく、ビューでコントローラーを定義できます。

8
Aman Mahajan

私のソリューション：

angular.module('myApp')
.config(function ($stateProvider) {
    $stateProvider
        .state('main', {
            url: '/',
            controller: function (Auth, $state) {
                if (someCondition) {
                    $state.go('state1');
                } else {
                    $state.go('state2');
                }
            }
        });
});

状態1と状態2は別の場所で定義されています。

5
Nitin Jadhav

ドキュメントの目的で、私は使用しました：

$rootScope.$on('$stateChangeStart', function(event, toState) {
  if ((toState.name !== 'login') && (!$localStorage.nickname)) {
    event.preventDefault();
    $state.go('login');
  }
});

$routeChangeStartを使用してもうまくいきませんでした。

4
abourget

どこでも（おそらく一部の高レベルのコントローラーで）'$routeChangeStart'イベントから$rootScopeそしてチェックを行います：

$rootScope.$on('$routeChangeStart', function(next, current){
    if(next != '/login' && !userLoggedIn){
        $location.path( "/login" );
    }
});

これは、ページに最初にアクセスしたときでも、新しいルートが設定されるたびに発生します。

1
tennisgent

質問を理解したら;ログインしていないユーザーが、ログインを必要とするページを表示できないようにする必要があります。それは正しいですか？

コントローラー内で次のようなコードを使用してこれを実行しました。

if(!'some condition that determines if user has access to a page'){
 $location.path( "/login" );
}
1
JeffryHouser

Iルートの条件付きビューで使用されます

$stateProvider.state('dashboard.home', {
        url: '/dashboard',
        controller: 'MainCtrl',
       // templateUrl: $rootScope.active_admin_template,
        templateProvider: ['$stateParams', '$templateRequest','$rootScope', function ($stateParams, templateRequest,$rootScope) {
          var templateUrl ='';
          if ($rootScope.current_user.role == 'MANAGER'){
            templateUrl ='views/manager_portal/dashboard.html';
          }else{
            templateUrl ='views/dashboard/home.html';
          }
          return templateRequest(templateUrl);
        }]
      });
0
Dinesh Vaitage