如何在AngularJS ui路由中修改状态的url

时间:2019-02-22 18:23:54

标签: angularjs angular-ui-router

我的角度为1.6。尝试覆盖ui路由器状态的值。

初始状态如下:

$stateProvider.state('parent', {
    abstract: true,
    parent: 'ancestor',
    url: '/parent',
    data: {
        authorities: [A,B]
    },
    views: {
        'content@': {
            templateUrl: 'app/scripts/myapp/module/parent.html'
        }
    }
})
.state('child', {
    parent: 'parent',
    abstract: true,
    views: {
        'tabs': {
            templateUrl: 'app/scripts/myapp/module/submodule/child.html',
            controller: 'ChildController',
            controllerAs: 'childController'
        }
    }
})
.state('grandChild', {
    parent: 'child',
    url: '/{dataSource:(?:option1|option2|option3)}',
    views: {
        'body': {
            templateUrl: 'app/scripts/myapp/module/submodule/grandchild.html',
            controller: 'GrandChildController',
            controllerAs: 'grandChildController'
        },
    },
    resolve: {
        groups: ['MyService', '$transition$', function (MyService, $transition$) {
            var selectedSource = $transition$.params().dataSource ? $transition$.params().dataSource : 'option1';
            return MyService.getGroups(selectedSource);
        }]
    }
})

然后在子实现之一中,我试图覆盖url的值-为状态之一添加 option4

var states = $stateRegistry.deregister('grandChild');
$stateRegistry.register(states[0]);//There is one more child. For simplicity not showing here. 
states[1].url.pattern = '/{dataSource:(?:option1|option2|option3|option4)}';
$stateRegistry.register(states[1]);

当我关注“ grandChild”时

$state.go('grandChild', {dataSource: 'option4'});

我收到错误消息

Param values not valid for state 'grandChild'. Invalid params: [ dataSource ]

当我检查$ state时

我看到一些奇怪的东西。

$state.$current.params.datasource.type.pattern = /(?:option1|option2|option3)/
$state.$current.url.pattern = "/{dataSource:(?:option1|option2|option3|option4)}"
$state.$current.url._compiled[0] = /((?:option1|option2|option3))/

0 个答案:

没有答案