Confusing $locationChangeSuccess and $stateChangeStart

Question

我根据用户有权查看的内容构建路径/状态和菜单。我环顾四周，尝试了几件不同的东西，但我正在打砖墙。只要调用RoleService.validateRole（），RoleService Factory中的SessionService对象就为空。没有添加路由，应用程序实际上已经死亡。为什么注入的工厂为空，方法未定义。

以下是按依赖顺序开始的应用程序的简化布局。

在app.run（）中，我将状态添加到应用程序而不是在配置中执行。

$stateProviderRef.state(value.stateName, state);

状态来自（工厂）AppConfig.getStates（），它返回一个数组。

var states = AppConfig.getStates();

在getStates（）中，我们验证每个路由的角色。

if(RoleService.validateRole(routes[i].role))

RoleService依赖于SessionService，而validateRole函数会检查：

if(SessionService.currentUser.role === role)

SessionService依赖于AuthenticationService，它只是一个使用$ http（用户对象）返回promise的工厂。 SessionService.currentUser是.then（）从AuthenticationService返回的promise的函数。

 return {
     currentUser: function(){
         AuthenticationService.then(function(result){
             return result;
         });
     }
 };

我不确定如何在不包含整个文件的情况下更好地解释代码。

Answer 1

根据plunker (mentioned in comment)，我将其更新/克隆到另一个is working

予。 simple - 返回静态数据时（无$ http）

因为服务SessonService的定义如下：

return {
    currentUser: function() {
    ...

我们不能将其称为财产：

...
return {
    validateRoleAdmin: function () {
        if (SessionService.currentUser.role === 'admin') {
        ...
    },

    validateRole: function (role) {
        if(SessionService.currentUser.role === role){
        ...

它是一个必须作为函数currentUser()调用的函数：

return {
    validateRoleAdmin: function () {
        if (SessionService.currentUser().role === 'admin') {
        ...
    },

    validateRole: function (role) {
        if(SessionService.currentUser().role === role){
        ...

II。等待异步调用

adjusted example

接下来，如果我们在示例中创建服务AuthenticationService的静态结果：

angular.module('daedalus').factory('AuthenticationService', 
    function() {
      return {"idsid": "ad_jdschuma","role": "user","id": "33333"}
    }
)

我们不能指望会有一些方法：

currentUser: function() {
  //AuthenticationService.then(function(result) {
  //  return result;
  //});
  return AuthenticationService;
}

为了使它真正异步，我们可以用它替换它：

angular.module('daedalus').factory('AuthenticationService', 
    ['$timeout', function($timeout) {

    return {
      getData: function() {
        return $timeout(function() {
          return {
            "idsid": "ad_jdschuma",
            "role": "user",
            "id": "33333"
          }
        })
      }
    };     
 }])

然后使用.then（） - 会话服务：

angular.module('daedalus').factory('SessionService', ['AuthenticationService', 
    function(AuthenticationService) {

        return {
              currentUser: function(){
                    return AuthenticationService
                      .getData()
                        .then(function(result){
                                return result;
                            });
                        }
        };
  }]
)

和RoleService：

  return {
    ...
    validateRole: function(route) {
      console.log('SessionService currentUser: ' + JSON.stringify(SessionService))
      return SessionService
        .currentUser()
        .then(function(userRole) {
          if (userRole.role === route.role) {
            return route;
          } else {
            return null;
          }
        })
    }

在appConfig中实现这一点

getStates: function(){
    var items = [];
    var deffered = $q.defer();
    var validatedCount = routes.length;
    for(var i=0,len=routes.length; i<len; i++){
      var route = routes[i];
      RoleService
        .validateRole(route) 
        .then(function(route){
            if(route) {
                 items.push(route.stateConfig)
          }
          if(--validatedCount === 0 ){ // all processed
           deffered.resolve(items)
          }
        })
    }
    return deffered.promise;
}

我们可以在跑步中这样做：

AppConfig
  .getStates()
  .then(function(states) {console.log(states)
    angular.forEach(states, function(value, key) {
      var state = {
        "url": value.url,
        "templateUrl": value.templateUrl,
        "controller": value.controller
      };
      $stateProviderRef.state(value.stateName, state);


    });
    // Configures $urlRouter's listener *after* your custom listener            
    $urlRouter.sync();
  });

$urlRouter.listen();

检查here

第二个解决方案（异步）的概念太.thenified()。我只是想表明一切正常。这里完全介绍了如何获取安全数据的更好方法：

Confusing $locationChangeSuccess and $stateChangeStart

使用服务Angularjs中的config生成.run（）中的路由

1 个答案:

予。 simple - 返回静态数据时（无$ http）

II。等待异步调用

Confusing $locationChangeSuccess and $stateChangeStart