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

I need dymanically in runtime hook child state to root state. Injection of $state into service seems to be in place nevertheless $state.state is evaluated as undefined. But $state returns valid object. How to fix it?

我需要在运行时将子状态转换为根状态。在服务中注入$state似乎是适当的，但是$state。状态被评估为未定义。但是$state返回有效对象。如何修复它吗?

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*/    
    } 
}]);

1 个解决方案

#1

Try to check these Q & A:

试着检查一下这些Q & A:

• AngularJS - UI-router - How to configure dynamic views
• AngularJS - UI-router -如何配置动态视图
• AngularJS - Dynamic Default nested views from Json Data not appearing
• AngularJS——动态默认嵌套视图，不显示Json数据

Where we can see that generally: we take a reference to $stateProvider in config() phase... and then use it in run() phase:

在配置()阶段，我们引用$stateProvider…然后在run()阶段使用:

The config() phase

配置()阶段

var $stateProviderRef;

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

The run() phase

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")
      });
  }]);