Question

我有两个兄弟姐妹状态，A和B匹配相同的URL 但是我想根据异步服务器的答案去A或B.

我创建了第三个州pivot。＆＃34; pivot＆＃34;是一个中间状态，它将根据在其父状态下完成的异步服务器调用重定向到A或B. pivot在其配置中有一个url：^/?page属性（但A和B没有此属性）。 pivot是A和B的兄弟姐妹。 pivot在$state.go()方法中有onEnter。

我遇到的问题是： - 首次显示页面时，父级的状态解析运行两次。 - 当点击从A切换到B或B切换到A的链接时，会触发Error: null is not an object (evaluating '$state.$current.locals[name]')。

请参阅http://jsfiddle.net/opeaucelle/6gqygkt7

$stateProvider
    .state('root', {
        abstract: true,
        views: {
            'main': {
                template:  '<ui-view name="body"></ui-view><hr />' +
                'ResolveNames : <li ng-repeat="resolveName in resolveNames track by $index">{{ resolveName }}</li>'
            }
        },
        resolve: {
            foo: function($rootScope) {
                if (! $rootScope.resolveNames) {
                    $rootScope.resolveNames = ['root'];
                } else {
                    $rootScope.resolveNames.push('root');
                }
            }
        }
    })
    .state('root.app', {
        params: {
            page: null
        },
        resolve: {
            appData: function($q, $rootScope, $stateParams, $timeout) {
                $rootScope.resolveNames.push('root.app');
                var defer = $q.defer();
                $timeout(function() {
                    // calculate target according to Asynchronous process
                    defer.resolve({target: "root.app." + $stateParams.page});
                }, 100);
                return defer.promise;
            }
        }
    })
    .state('root.app.pivot', {
        url: '^/?page',
        views: {
            'body@root': {
                template: '<div>default body</div>'
            }
        },
        onEnter: function($state, appData) {
            if (appData.target) {
                $state.go(appData.target); // change state
            }
        }
    })
    .state('root.app.a', {
        views: {
            'body@root': {
                template: '<h2>body A</h2>'
            }
        }
    })
    .state('root.app.b', {
        views: {
            'body@root': {
                template: '<h2>body B</h2>'
            }
        }
    });

我该怎么办？

angularJs / ui-router：在解析期间改变状态的能力

0 个答案: