동적으로 UI 라우터 상태로드

Question

내 앱에 성공적으로 로그인 한 후 사용자가 사용할 수있는 모든 상태를 api/js에서 동적으로로드하려고합니다. 동적으로로드 된 상태에는 항상 유일한 알려진 상태 인 추상 상태 app.module이 포함되며 동일한 다운로드의 다른 모든 상태에 대한 루트입니다.

내 첫 번째 접근 방식은 로그인 후 oc.lazyLoad를 사용하는 것이 었습니다. 그것은 잘 동작하지만 브라우저를 새로 고칠 때가 아닙니다. 그런 다음 module.run에서 oc.lazyLoad를 사용하여로드하려고했지만 작동하지 않았습니다.

나는 ui-router extras에서 futureState와 함께 oc.lazyLoad를 사용하려고 시도했지만 제대로 작동하지 않습니다.

내가 원하는 것을 수행 할 수 있다면 $futureStateProvider을 구성하는 방법에 대한 도움이 필요합니다.

Answer 1

게으른로드가 필요하지 않습니다.

동적 상태를 추가하는 경우. 난 단지 설정 단계에서 내 애플 리케이션에 상태 공급자 참조를 추가해야합니다.

angular.module('app.module').config(function ($stateProvider, $urlRouterProvider) { 
     angular.module('app.module').$stateProvider = $stateProvider;   
     //send to login first 
     $urlRouterProvider.otherwise("/user/login");  
}); 

는 사용자 로그인 성공 후 로그인 서비스, 상태 제공자에게 소식 상태를 추가 할 수 있습니다.

loginSuccess(){ 
    $http.get('api/states/').then(function(states){ 
    bindStates(states); 
    }); 
} 

function bindStates(states) { 
    states.forEach(function bind(stateData) { 
     // add new states 
     angular.module('app.module').$stateProvider.state({ 
      name: stateData.name, 
      url: stateData.url, 
      template: stateData.template, 
      params: { 
       'pageId': null 
      }, 
      abstract: stateData.abstract 
     }); 
    }); 

    // go to default state 
    $state.go('main'); 
}