Question

我有一个包含2个不同子页面的页面。

search状态是主要容器，加载时会自动search.list。

当用户导航到search.detail时，它将调用最后一条路径，该路线将包含在search主框架内。

问题是我默认无法加载search.list。

    $stateProvider.state('search', {
        url: '/search/{appId}{reportId:(?:/[^/]+)?}',
        templateUrl: 'app/search/search.tpl.html',
        controller: 'SearchCtrl',
        resolve: {
            app: function($stateParams, AppsModel) {
                return AppsModel.findOne($stateParams.appId);
            }
        }
    });

    $stateProvider.state('search.list', angularAMD.route({
        controller: 'ListCtrl',
        templateUrl: 'app/search/list/list.tpl.html'
    }));

    $stateProvider.state('search.detail', {
        url: '/detail/{recordId}',
        title: "Search",
        views:{
            '': {
                templateUrl: 'app/search/detail/detail.tpl.html',
                controller: 'DetailCtrl'
            },
            'grid@search.detail': {
                controller: 'ListCtrl',
                templateUrl: 'app/search/list/list.tpl.html'  
            },
            'record@search.detail': {
                templateUrl: 'app/record/views/record.html',
                controller: 'RecordCtrl'
            }
        }
        }
    });

如果我将网址和app解析属性移至search.list，则主容器无法解析需要呈现的app。

如果我仅将网址属性移至search.list search，则appId中没有$state属性来解决此问题。

在我的搜索控制器中，我添加了：

    if(!$state.is('search.detail')) $state.go('search.list');

但这仅适用于第一页加载，如果我转到详细信息然后返回它不会加载列表，因为控制器已重新启动。有什么想法吗？

Answer 1

最终将search和search.list合并为：

    $stateProvider.state('search', {
        url: '/search/{appId}{reportId:(?:/[^/]+)?}',
        title: "Search",
        cssClass: 'SearchCtrl ListCtrl',
        views:{
            '': {
                controller: 'SearchCtrl',
                templateUrl: 'app/search/search.tpl.html',
            },
            '@search': {
                controller: 'ListCtrl',
                templateUrl: 'app/search/list/list.tpl.html'  
            }
        },
        resolve: {
            app: function($stateParams, AppsModel) {
                return AppsModel.findOne($stateParams.appId);
            }
        }
    });

AngularJS ui-router初始路由

1 个答案: