AngularJS UI-ルータアクセス$ stateParams州のデータから

Question

はUI-ルータで次の状態を指定されたオブジェクト：

.state('some.state', { 
    url: '/some/:viewType', 
    templateUrl: 'myTemplate.html', 
    controller: 'SomeStateController', 
    controllerAs: 'vm', 
    data: { 
     authorizedFor: [SOME_ROLE] 
    } 
} 

私は認可へのアクセスを制御を助けるために国家のために、「データ」オブジェクトを使用しようとしています状態。これとは別に、$ stateChangeStartイベントを処理してdata.authorizedForを調べ、それに応じて動作します。

ただし、問題は、許可されたロールのリストがviewTypeの値に基づいて変更される可能性があることです。私はデータ：{}を関数にして$ stateParamsを注入し、そのロジックを処理できると思ったが、それはしない。

代わりにparamsオブジェクトを使ってみましたが、$ stateChangeStart時には：viewTypeはまだ$ state.paramsまたは$ stateParamsからアクセスできません。

devツールを実行すると、$ state.transitionTo.argumentsに値が設定されていることがわかりましたが、そのルートに行くのは非常にハッキーです。

params: { 
    authorizedFor: function($state) { 
     console.log($state.transitionTo.arguments[1].viewType); // has value I need 
    } 
} 

お勧めはありますか？

Answer 1

私の提案は、resolveを使用して、状態に特有のコンテンツまたはデータをコントローラに提供することです。 resolveは、コントローラに注入されるべき依存関係のオプションのマップです。

これらの依存関係のいずれかが約束されている場合、それらは解決され、コントローラがインスタンス化されて$ stateChangeSuccessイベントが発生する前に値に変換されます。例えば

：

$stateProvider 
     .state('profile', { 
      url: '/profile', 
      templateUrl: 'profile.html', 
      resolve:{ 
       'ProfileService': function(ProfileService){ 
        return ProfileService.promise_skillRecommendation_mock; 
       } 
      } 
     }) 

ProfileServiceにコード：

var app = angular.module('app').service("ProfileService", function($http){ 
    var myData = null; 

    var promise_skillRecommendation_mock = 
     $http.get('Mock/skillRecommendation-mock.json') 
      .success(function(data){ 
       myData = data; 
      }); 
    return{ 
     promise_skillRecommendation_mock: promise_skillRecommendation_mock, 
     get_skillRecommendation: function(){ 
      return myData; 
     } 
    }; 
}); 

、このサービスを使用する制御コードである：

angular.module('app').controller('ProfileController', function($scope, $http, ProfileService){ 


    $scope.skillRecommendation = ProfileService.get_skillRecommendation(); 

以下解決にオブジェクトがなければなりませんコントローラがインスタンス化される前に（約束されていればdeferred.resolve（）によって）解決されます。各解決オブジェクトがパラメータとしてコントローラにどのように注入されているかに注目してください。

このコードを使用すると、約束が解決された後にのみページが表示されます。勧告のためのhttps://github.com/angular-ui/ui-router/wiki