角度 ui 路由器解析服务停止路由更改

Angular ui-router resolve service halting route change

本文关键字：路由 服务 ui 路由器 角度      更新时间：2023-09-26
在

允许交换机进入该状态之前，尝试让ui路由器解析身份验证服务。

不幸的是，它继续逃避我，每当我注入不属于 Angular 的服务时，都会悬挂角度。

我知道我无法将服务注入 .config，但我肯定应该能够在加载控制器之前执行此操作？

以下是代码的精简版本：

app.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
// For any unmatched url, redirect to state:home
$urlRouterProvider.otherwise("/");
// Now set up the states
$stateProvider
    .state('home', {
        url: "/",
        templateUrl: "partials/home.html",
        resolve: {
            isAuthorised: ['$log', '$q', 'Auth', function ($log, $q, auth) {
                var q = $q.defer();
                $log.debug("checking if authorised..."); //this doesn't show
                if (auth.whatever()) {
                    q.resolve(true);
                } else {
                    q.reject(false);
                }
                return q.promise;
            }]
        },
        controller: "DefaultCtrl"
    });
}]);

所以控制器从来没有真正被实例化......控制台中没有错误。

如果我输入任何随机字符串作为服务名称，也会发生同样的情况......所以我最好的猜测是它找不到它？但是该应用程序的所有其他区域都可以...

我

花了一段时间研究这个，我很确定我应该能够以某种方式完成这项工作。

任何帮助将不胜感激。

授予。

编辑

感谢克里斯T的Plunkr！我正在接近这个问题，我添加了您的控制台日志，但出现以下错误：

Start:   {} -> home{}
Error:   {} -> home{} ReferenceError: $window is not defined {stack: "ReferenceError: $window is not defined↵    at a (h…pm/planitmoney/claw/dist/js/bower.min.js:815:112)", message: "$window is not defined"}

那个bower.min.js文件只是角度，后跟UI路由器。我要做更多的检查。再次感谢。

再次感谢创建 Plunkr 的 Chris T：http://plnkr.co/edit/aeEt4ddUYMM3xRi8M38T?p=preview这有助于解决问题。

我将他在那里的控制台日志复制到我的应用程序中：

// Adds state change hooks; logs to console.
app.run(function($rootScope, $state) {
$rootScope.$state = $state;
function message(to, toP, from, fromP) { return from.name  + angular.toJson(fromP) + " -> " +     to.name + angular.toJson(toP); }
$rootScope.$on("$stateChangeStart", function(evt, to, toP, from, fromP) { console.log("Start:   " + message(to, toP, from, fromP)); });
$rootScope.$on("$stateChangeSuccess", function(evt, to, toP, from, fromP) { console.log("Success: " + message(to, toP, from, fromP)); });
$rootScope.$on("$stateChangeError", function(evt, to, toP, from, fromP, err) {     console.log("Error:   " + message(to, toP, from, fromP), err); });
});

我立即注意到错误的地方：

Start:   {} -> home{}
Error:   {} -> home{} ReferenceError: $window is not defined {stack: "ReferenceError: $window is not defined↵    at a (h…pm/planitmoney/claw/dist/js/bower.min.js:815:112)", message: "$window is not defined"}

深入挖掘，我将错误追溯到实际抛出它的内容，几分钟后修复了错误。

我尝试解析的服务也调用了它自己的一些依赖项。我不知道其中一项服务中缺少$window注射。

控制台中未显示错误我想这可能是因为它被访问的独特方式(使用 ui-routers 解析(要么是我在应用程序中使用 Raven 把它扔到了我没有看到的地方。

我希望这有助于其他人深入了解任何问题。

再次感谢大家。

我们有一个类似的设置，可以检查本地存储中的令牌并解析承诺。

检查以下示例：

var requireUser = { User: [ "$location", "$rootScope", "$q", "API", "Session",
    function ( $location, $rootScope, $q, API, Session )
    {
        var deferred = $q.defer();
            if( Session.get.authToken() )
            {
                if( Session.get.user() )
                {
                    deferred.resolve( $rootScope.user );
                }
                else
                {
                    $location.path( "/login" );
                }
            }
            else
            {
                deferred.reject( "No user token" );
                $location.path( "/login" );
            }
        return deferred.promise;
    } ] };
$routeProvider
    .when( "/users", { templateUrl: "/build/templates/users.html", controller: "UsersCtrl", resolve: requireUser, active: "users" } )
相关文章：