Question

我目前在我的应用程序中有一个状态层次结构，如此;

- module_base
    - page_base
        - tab_one
        - tab_two
        - tab_three

page_base状态是抽象的，并且有一个Controller，它返回页面的记录（例如GET /products/123），然后子选项卡可以访问它。

我遇到的问题是，当每次重新运行page_base状态的Controller上方的选项卡之间进行转换时，意味着每次转换都会检索产品资源。

用于在标签之间导航的菜单只是<a/>的列表ui-sref（例如<a ui-sref=".tab_one">Tab One</a>）。我使用reload查看了notify和ui-sref-opts参数，但它们似乎没有区别。

如何强制page_base状态仅在页面/products/3/*上加载一次，但请确保它在页面products/9/*上重新运行？

此外，首次打开时是否可以加载tab_*一次，但如果重新加载则不会重新加载？

非常感谢！

状态配置;

// Page Base
.state('module_base.page_base', {
    abstract: true,
    url: '/{id:int}',
    views: {
        base: {
            templateUrl: 'path/to/baseTemplate.html',
            controller: 'BaseController', // Reruns whenever the child states are loaded
            controllerAs: 'baseVm'
        },
        'sidebar': {
            // Configuration for the app sidebar
        }
    },
    resolve: {
        // ACL permissions check
    }
})


// Tab one
.state('module_base.page_base.tab_one', {
    url: '/tab-one',
    views: {
        'page': {
            templateUrl: 'path/to/template.html',
            controller: 'TabOneController',
            controllerAs: 'vm'
        }
    }
})

// Tab two
.state('module_base.page_base.tab_two', {
    url: '/tab-two',
    views: {
        'page': {
            templateUrl: 'path/to/template.html',
            controller: 'TabTwoController',
            controllerAs: 'vm'
        }
    }
})

Answer 1

事实证明，这种情况在国家层级中更高。在每个状态转换之间进行ACL权限检查，在此过程中，$rootScope变量在检查期间设置为false，然后在解决后更新为true。主应用程序容器有一个ng-if="$root.userIsAuthorised"，它从DOM中删除了整个应用程序，然后重新添加它。这导致所有路由重新运行，反过来又重新运行控制器。

简而言之，修复是使用ng-show / ng-hide处理隐藏而不从DOM中删除，控制器按预期运行。

Answer 2

我认为如果这是您想要的，那么您不应该为子标签使用单独的controller。因此，请尝试从州中删除controller和controllerAs属性。通过这样做，父/子（共享）controller被加载一次。

Angular UI Router - 在子节点之间切换时防止重新运行父状态

2 个答案: