URL 来自 $routeChangeStart angularjs 路线中的路线参数

Question

如何从 $routeChangeStart 中的路由参数中获取 URL 散列片段？

$scope.$on('$routeChangeStart', function (event, next, current) {
  // trying to get the url hash fragment from <next> param here
  // e.g. to_url_function(next) -> '/my_path/1'
});

使用 $locationChangeStart 接收 URL hash 片段会很容易，但这对我来说不是一个选项。

Answer 1

dasboe：我想我正在回答你的问题。

我有一个应用 authentication/authorization 在 $routeChangeStart 事件处理程序中检查。如果未通过身份验证，我会向用户显示模态登录页面。我想要一个成功的登录将它们发送到他们原来的目的地（$routeChangeStart 的美妙之处在于它将再次运行并在成功登录后检查授权）。我将从下一个构建的路径保存在注入模态登录控制器的用户会话服务中。

这里是事件处理器

//before each route change, check if the user is logged in
//and authorized to move onto the next route
$rootScope.$on('$routeChangeStart', function (event, next, prev) {
    if (next !== undefined) {
        if ('data' in next) {
            if ('authorizedRoles' in next.data) {
                var authorizedRoles = next.data.authorizedRoles;
                if (!SessionService.isAuthorized(authorizedRoles)) {
                    event.preventDefault();
                    SessionService.setRedirectOnLogin(BuildPathFromRoute(next));
                    if (SessionService.isLoggedIn()) {
                        // user is not allowed
                        $rootScope.$broadcast(AUTH_EVENTS.notAuthorized);
                    } else {
                        // user is not logged in
                        $rootScope.$broadcast(AUTH_EVENTS.notAuthenticated);
                    }
                }   
            }
        }
    }
});

这是从下一个对象构建路径的函数

function BuildPathFromRoute(routeObj)
{
    var path = routeObj.$$route.originalPath;
    for (var property in routeObj.pathParams)
    {
        if (routeObj.pathParams.hasOwnProperty(property))
        {
            var regEx = new RegExp(":" + property, "gi");
            path = path.replace(regEx, routeObj.pathParams[property].toString());
        }
    }
    return path;
}

备注：

我不喜欢我的 $$route 依赖，但我找不到任何其他方法来做到这一点。也许我错过了更容易的事情。从长远来看，我可能会自找麻烦。
preventDefault() 不适用于 1.3.7 之前的 AngularJS 版本（参见 event.preventDefault() not working for routeChangeStart in angularjs app）。
标准警告：这都是客户端的，可能会被滥用。确保 authentication/authorization 发生在服务器端。
下一个 Route 对象（来自事件处理程序）也有一个参数属性。我不确定我是否应该像使用 pathParams 那样旋转它的属性。

Answer 2

如果您不想使用 hasOwnProperty，您可以利用 $$route.keys 获取 pathParams 字段名称的名称：

function getPathFromRoute(routeObj)
{
    var path = routeObj.$$route.originalPath;
    var keys = routeObj.$$route.keys;
    var value;       
    for (var i = 0; i < keys.length; i++) {
        if(angular.isDefined(keys[i]) && angular.isDefined(keys[i].name)){
            value = routeObj.pathParams[keys[i].name];
            var regEx = new RegExp(":" + keys[i].name, "gi");
            path = path.replace(regEx, value.toString());            
        }
    }     
    return path;
};

Answer 3

不要像之前给出的答案那样使用带有 $$ 前缀的对象字段，因为它是 AngularJS 用于私有属性的前缀。使用此方法从路由中获取 url（未测试）：

    var buildPathFromRoute = function (route) {
    // get original route path
    var path = route.originalPath;
    // get params keys
    var keysLength = route.keys.length;
    for (var i=0; i<keysLength; i+=1) {
        var param = route.keys[i];

        // optional params postfix is '?'
        var postfix = param.optional ? '\?' : '';

        var replaceString = ':' + param.name + postfix;
        var regex = new RegExp(replaceString, 'g');
        var paramValue = route.params[param.name].toString();

        // replace param with value
        path = path.replace(regex, paramValue);
    }

    path = path.replace(/\:\S+?\??/g, '');
    return path;
};

URL 来自 $routeChangeStart angularjs 路线中的路线参数

URL from $routeChangeStart route params in angularjs routes

angularjs

angularjs-routing