javascript - AngularJS 多重解析

标签 javascript angularjs angular-ui-router

这是我的ui-router 特定路由的配置

state('app.merchant', {
                url: '/start/merchant',
                views: {
                    'mainView': {
                        templateUrl: "partials/start_merchant.html"
                    }
                },
                css: ['assets/vendor/bootstrap/dist/css/bootstrap.css','assets/css/styles.css','assets/css/plugins.css'],
                title: 'Buttons',

                resolve: {
                    userRequired: userRequired,
                }

                resolve: loadSequence('flow','angularFileUpload','MerchantWizardCtrl')

            })

问题是,即使页面不满足 userRequired 要求,也会显示该页面。这是 userRequired 的函数:

function userRequired($q, $location, $auth,Account) {
      var deferred = $q.defer();
      if ($auth.isAuthenticated()) {

          Account.getUserStatus()
              .then(function(response){
                if(response.data == true){
                    deferred.resolve();
                }
                  else{
                    deferred.reject();
                }
              })
              .catch(function(response){
                  console.log("Error has occur, Please contact adminstrator");
              });
      } else {
          deferred.resolve();
      }
      return deferred.promise;
    }

如何解决?谢谢!!

编辑

加载顺序:

function loadSequence() {
        var _args = arguments;

        return {
            deps: ['$ocLazyLoad', '$q',
            function ($ocLL, $q) {
                var promise = $q.when(1);
                for (var i = 0, len = _args.length; i < len; i++) {
                    promise = promiseThen(_args[i]);
                }
                return promise;

                function promiseThen(_arg) {

                    if (typeof _arg == 'function')
                        return promise.then(_arg);
                    else
                        return promise.then(function () {
                            var nowLoad = requiredData(_arg);
                            //console.log(nowLoad)
                            if (!nowLoad)
                                return $.error('Route resolve: Bad resource name [' + _arg + ']');
                            return $ocLL.load(nowLoad);
                        });
                }

                function requiredData(name) {
                    if (jsRequires.modules)
                        for (var m in jsRequires.modules)
                            if (jsRequires.modules[m].name && jsRequires.modules[m].name === name)
                                return jsRequires.modules[m];
                    return jsRequires.scripts && jsRequires.scripts[name];
                }
            }]
        };
    }

最佳答案

当 getUserStatus() 服务抛出异常时(在 .catch() 中),以及未通过身份验证时必须拒绝时,您不会拒绝 promise ,请尝试此解决方案:

state('app.merchant', {
    url: '/start/merchant',
    views: {
        'mainView': {
            templateUrl: "partials/start_merchant.html"
        }
    },
    css: ['assets/vendor/bootstrap/dist/css/bootstrap.css','assets/css/styles.css','assets/css/plugins.css'],
    title: 'Buttons',
    resolve: {
        userRequired: userRequired,
        loadSequence: loadSequence('flow','angularFileUpload','MerchantWizardCtrl')
    }
})

function userRequired($q, $location, $auth,Account) {
  return $q(function(resolve, reject) {
    if ($auth.isAuthenticated()) {
        Account.getUserStatus()
            .then(function(response){
              if(response.data == true){
                resolve();
              }
                else{
                reject();
              }
            })
            .catch(function(response){
              console.log("Error has occur, Please contact adminstrator");
              reject()
            });
    } else {
        reject()
    }
  });
}

function loadSequence() {
    var _args = arguments;

    return ['$ocLazyLoad', '$q', function ($ocLL, $q) {
            var promise = $q.when(1);
            for (var i = 0, len = _args.length; i < len; i++) {
                promise = promiseThen(_args[i]);
            }
            return promise;

            function promiseThen(_arg) {

                if (typeof _arg == 'function')
                    return promise.then(_arg);
                else
                    return promise.then(function () {
                        var nowLoad = requiredData(_arg);
                        //console.log(nowLoad)
                        if (!nowLoad)
                            return $.error('Route resolve: Bad resource name [' + _arg + ']');
                        return $ocLL.load(nowLoad);
                    });
            }

            function requiredData(name) {
                if (jsRequires.modules)
                    for (var m in jsRequires.modules)
                        if (jsRequires.modules[m].name && jsRequires.modules[m].name === name)
                            return jsRequires.modules[m];
                return jsRequires.scripts && jsRequires.scripts[name];
            }
        }]
}
  • 将 defer 方法更改为 Promise A+ 方法(我推荐这种方式)。

  • 在 .catch 中添加 reject()

  • 未通过身份验证时拒绝

关于javascript - AngularJS 多重解析,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33431797/

相关文章:

javascript - 如何更改 jQuery Mobile 页面上的占位符字体?

javascript - setImmediate 和 Internet Explorer 以外的浏览器

javascript - 按表排序但索引不跟随

javascript - 如何使用 ES6 类在 AngularJS Controller 中保持注入(inject)的依赖项私有(private)

javascript - "Cannot transition to abstract state' “当试图在侧边栏中突出显示父项时

html - 用户界面路由器 : ui-sref not changing font color

Javascript mouseover 仅适用于第一个元素

javascript - 如何使用 .not 更改选择器以应用于 dom 元素

javascript - 使用 ui-sref 解析处于 ui-router 状态的对象

javascript - Angularjs ui 路由器正则表达式