如何使用 ui-router 在运行时挂钩新的子状态？

Question

我需要在运行时动态挂钩子状态到根状态。将 $state 注入服务似乎已经到位，但是 $state.state 被评估为 undefined。但是 $state returns 有效对象。如何解决？

app.service('EntryStateUrlService', ['$state', '$q', '$http', function($state,$q,$http){

    this.getEntryStateUrl = function(feeds) {

       var deferred = $q.defer();
       var idx = 0,
           promises = [];

       feeds.forEach(function(e) {
           $http.jsonp(e.link).success(function(data) {

               var generatedStateName = data.title;

               $state.state('root.' + generatedStateName, // $state.state is evaluated 
               {                                          // as undefined
                   templateUrl : '/partials/article-view.html', // here taking template
                   controller:   function($scope){ // controller to pass 
                       $scope.title = data.title;  // values to this template
                       $scope.author = data.author;
                   }
               })
            });
        });     
        /*stuff*/    
    } 
}]);

Answer 1

尝试查看这些问答：

AngularJS - UI-router - How to configure dynamic views
AngularJS - Dynamic Default nested views from Json Data not appearing

我们通常可以看到的地方：我们在 config() 阶段引用 $stateProvider... 然后在 run() 阶段使用它：

config()阶段

var $stateProviderRef;

app.config(function ($stateProvider) {
    $stateProviderRef = $stateProvider;
});

run()阶段

app.run(['$q', '$rootScope', '$state', 'menuItems',
  function ($q, $rootScope, $state, menuItems) {

    // get some data somehow .. via $http
    menuItems
      .all()
      .success(function (data) 
      {
          // here we iterate the data
          angular.forEach(data, function (value, key) {

              // here we do DYNAMICALLY insert new states
              $stateProviderRef.state(value.name, value);
          });
          $state.go("home")
      });
  }]);

如何使用 ui-router 在运行时挂钩新的子状态？

How to hook new child state in runtime using ui-router?

angularjs

angular-ui-router