Angularjs ui-router具有解析的抽象状态

Question

是否有可能使用需要解析数据的ui-router进行抽象状态？我需要使用配置文件信息加载页面的上半部分,然后使用子导航加载页面底部的其他详细信息.这个想法是抽象状态每次都会加载配置文件信息,无论我在哪个子状态.它似乎不起作用.

例:

.state('app.profile', {
    abstract: true,
    url: 'user/:username',
    views: {
        content: {
            templateUrl: 'views/frontend/profile.html',
            controller: 'ProfileCtrl',
            resolve: {
                data: ['$stateParams', 'ProfileService', function ($stateParams, ProfileService) {
                    var username = $stateParams.username;
                    return ProfileService.getProfile(username);
                }]
            }
        }
    }
})
.state('app.profile.something', {
    url: '',
    views: {
        profile: {
            templateUrl: 'views/frontend/profile.something.html',
            controller: 'ProfileCtrl',
            resolve: {
                data: ['$stateParams', 'ProfileService', function ($stateParams, ProfileService) {
                    var username = $stateParams.username;
                    return ProfileService.getProfileSomething(username);
                }]
            }
        }
    }
})

Answer 1

这里的解决方案是区分已解析数据的名称.检查这个答案:

• angular ui-route state parent和resolve(嵌套解析)

和它的 plunker

所以在我们的例子中,我们需要父母的这种改变

resolve: {
    dataParent: ['$stateParams', 'ProfileService', function ($stateParams, ProfileService) {
        var username = $stateParams.username;
        return ProfileService.getProfile(username);
    }]
}

这在孩子身上

resolve: {
    dataChild: ['$stateParams', 'ProfileService', function ($stateParams, ProfileService) {
        var username = $stateParams.username;
        return ProfileService.getProfileSomething(username);
    }]
}

所以,我们不会使用resolve:{data:...}在父母和孩子中使用:

// parent state
resolve : { dataParent: ... } 
// child state
resolve : { dataChild: ... } 

一个工作的例子应该比其他词更好......