解决角UI路由器

在我的角度样的路线，我试图做的事：解决角UI路由器

(function(angular){ 
    'use strict'; 

    angular 
     .module('appRouter',['ui.router']) 
     .controller('routerCtrl',function(myResolveServ,resolveData){ 
      console.log(resolveData); 

     }) 
     .service('myResolveServ',function($http){ 
      this.getResolveData = function($http){ 
       var root = 'https://jsonplaceholder.typicode.com'; 
       return $http.get(root+'/posts/1').then(function(response){ 

        return response.data; 
       }); 
      } 
     }) 
     .config(function($stateProvider,$urlRouterProvider){ 
      $stateProvider 
       .state('settings.profile',{ 
        url:'/profile', 
        templateUrl:'templates/profile.html' 
       }) 
       .state('settings.account',{ 
        url:'/account', 
        templateUrl:'templates/account.html', 
        controller:'routerCtrl', 
        controllerAs:'vm', 
        resolve:{ 
         resolveData :function(myResolveServ){ 
          var data = myResolveServ.getResolveData(); 
         } 
        } 
       }); 

      $urlRouterProvider.otherwise('/settings/profile'); 


     }); 

})(window.angular);

但这代码不起作用。我无法导航到帐户页面URL /settings/account。

错误在控制台中不明显。

我在做什么错？

UPDATE

我知道这个工程：

   resolve:{ 
        resolveData : function($http){ 
         var root = 'https://jsonplaceholder.typicode.com'; 
         return $http.get(root+'/posts/1').then(function(response){ 

          return response.data; 
         }); 
        } 
       }

来源

2017-01-27 StrugglingCoder

您说'去URL /设置/帐户' - 那究竟是什么？ settings.account是状态，它的URL是/ account，所以哪一个是/ settings/account？ – rrd

你需要在你的决心返回数据路由settings.account

resolveData: function(myResolveServ) { 
    return myResolveServ.getResolveData(); 
}

来源

2017-01-27 13:39:59 Dario

我试过了，但它没有记录在控制器中发生的控制台中。 – StrugglingCoder

尝试使用更新的代码 – Dario

不能正常工作。服务看起来好吗？控制器应该记录数据吗？ – StrugglingCoder

这很难说为什么，你应该看ui路由器错误。粘贴下面的代码，并寻找错误

var $rootScope = angular.element(document.querySelectorAll("#home")[0]).injector().get('$rootScope'); 

$rootScope.$on('$stateChangeStart',function(event, toState, toParams, fromState, fromParams){ 
    console.log('$stateChangeStart to '+toState.to+'- fired when the transition begins. toState,toParams : \n',toState, toParams); 
}); 

$rootScope.$on('$stateChangeError',function(event, toState, toParams, fromState, fromParams){ 
    console.log('$stateChangeError - fired when an error occurs during transition.'); 
    console.log(arguments); 
}); 

$rootScope.$on('$stateChangeSuccess',function(event, toState, toParams, fromState, fromParams){ 
    console.log('$stateChangeSuccess to '+toState.name+'- fired once the state transition is complete.'); 
}); 

$rootScope.$on('$viewContentLoaded',function(event){ 
    console.log('$viewContentLoaded - fired after dom rendered',event); 
}); 

$rootScope.$on('$stateNotFound',function(event, unfoundState, fromState, fromParams){ 
console.log('$stateNotFound '+unfoundState.to+' - fired when a state cannot be found by its name.'); 
    console.log(unfoundState, fromState, fromParams); 
});`

来源

2017-01-27 14:07:07 LookForAngular

解决角UI路由器

回答

相关问题