AngularJS, UI路由器-导航到"foo/bar"去“foo"”

AngularJS, UI Router - Navigating to "foo/bar" goes to "foo"

本文关键字：quot foo bar 导航 AngularJS UI 路由器      更新时间：2023-09-26

对于一个特定的应用程序，我已经定义了几个状态，但我有两个特别的问题。

它们是这样的:

 $stateProvider.state('foo', {
        url: '/foo',
        views: {
            "main": {
                controller: 'fooController',
                controllerAs: 'ctrl',
                templateUrl: 'a.html'
            },
        }           
    }).state('bar', {
        url: '/foo/bar/:id',
        views: {
            "main": {
                controller: 'barController',
                controllerAs: 'ctrl',
                templateUrl: 'b.html'
            },
        }
    });

问题:当我在浏览器中直接导航到/foo/bar/123时，路由工作。然而，如果我导航到/foo，然后到/foo/bar/123状态短暂加载，然后导航回/foo。

问题:除了改变'/foo/bar'为'/bar'我怎么能解决这个问题?

我相信所有你正在寻找的是一个改变你的配置。

$stateProvider.state('foo', {
        url: '/foo',
        views: {
            "main": {
                controller: 'fooController',
                controllerAs: 'ctrl',
                templateUrl: 'a.html'
            },
        }           
    }).state('foo.bar', {
        url: '/bar/:id', //This will still evaluate to /foo/bar/:id
        views: {
            "main": {
                controller: 'barController',
                controllerAs: 'ctrl',
                templateUrl: 'b.html'
            },
        }
    });

你的url应该仍然是/foo/bar/:id，但是ui-router会为你将它们连接在一起，因为你说foo是bar的父路由。它现在可能会感到困惑，因为它看到两个使用/foo的路由，并且不知道使用哪个，所以它默认使用定义的第一个。

参考:https://github.com/angular-ui/ui-router/wiki/URL-Routing

相关文章：