防止在嵌套视图中重新加载控制器

Question

我对模块化管理员进行编码，只需要一次加载特定数据。

<div id="main" ui-view>
    <div ui-view="header"></div>
    <div ui-view="sidebar"></div>

    <!-- Start: Content-Wrapper -->
    <section id="content_wrapper">
        <div ui-view="topbar"></div>
        <div ui-view="main"></div>
        <div ui-view="footer"></div>
    </section>
</div>

Topbar，页眉和页脚只能加载一次或特定事件。

我已经设置了这样的状态：

$stateProvider
    .state('root', {
        url: '/',
        views: {
            'header@': {
                templateUrl: '/angular/apps/backend/views/template/header.html',
                controller: 'AuthController'
            },
            'sidebar@':{
                templateUrl: '/angular/apps/backend/views/template/sidebar.html',
                controller: 'AppsController'
            },
            'topbar@':{
                templateUrl: '/angular/apps/backend/views/template/topbar.html'
            },
            'footer@':{
                templateUrl: '/angular/apps/backend/views/template/footer.html',
                controller: ''
            },
            'main':{
                templateUrl: '/angular/apps/backend/views/inicio.html',
                controller: ''
            }
        },
        data: {
            title: 'Dashboard',
            bodyClass: '',
            requiredLogin: true
        }
    })
    .state('login', {
        url: '/login',
        templateUrl: '/angular/apps/backend/views/login.html',
        controller: 'AuthController',
        data: {
            title: 'Iniciar Sesión',
            bodyClass: 'external-page sb-l-c sb-r-c',
            requiredLogin: false
        }
    })
    .state('applist', {
        url: '/:AppPermalink',
        views: {
            'header@': {
                templateUrl: '/angular/apps/backend/views/template/header.html',
                controller: 'AuthController'
            },
            'sidebar@':{
                templateUrl: '/angular/apps/backend/views/template/sidebar.html',
                controller: 'AppsController'
            },
            'topbar@':{
                templateUrl: '/angular/apps/backend/views/template/topbar.html'
            },
            'footer@':{
                templateUrl: '/angular/apps/backend/views/template/footer.html',
                controller: ''
            },
            'main':{
                templateUrl: '/angular/apps/backend/views/appresults.html',
                controller: 'AppController'
            }
        },
        data: {
            title: 'Dashboard',
            bodyClass: '',
            requiredLogin: true
        }
    })
    .state('appedit', {
        url: '/:AppPermalink/editar/:Itemid',
        views: {
            'header@': {
                templateUrl: '/angular/apps/backend/views/template/header.html',
                controller: 'AuthController'
            },
            'sidebar@':{
                templateUrl: '/angular/apps/backend/views/template/sidebar.html',
                controller: 'AppsController'
            },
            'topbar@':{
                templateUrl: '/angular/apps/backend/views/template/topbar.html'
            },
            'footer@':{
                templateUrl: '/angular/apps/backend/views/template/footer.html',
                controller: ''
            },
            'main':{
                templateUrl: function(stateParams){return '/angular/apps/backend/views/appedit_'+stateParams.AppPermalink+'.html'},
                controller: 'AppController'
            }
        },
        data: {
            title: 'Dashboard',
            bodyClass: '',
            requiredLogin: true
        }
    })

但是当我改变状态时，侧边栏的数据已经重新加载。

我没有设计好的嵌套视图。怎么能这样做？

Answer 1

找到解决方案！我需要使用抽象状态来定义“sidebar”，“header”，“topbar”和“footer”。

permalinks_type

控制器只执行一次：）