首页 > 解决方案 > Angular 在更改状态后显示 2 个视图

问题描述

我有初始化 app.js 脚本,其中概述了我的应用程序的可能状态

问题是当我打开公司状态然后打开新闻或事件状态时,它不会替换另一个状态的 '' 视图,而只是将其合并..

app.config(function($stateProvider, $urlRouterProvider, $locationProvider, $compileProvider) {

    $stateProvider
        .state('main', {
            url: '/',
            views: {
                'search': {
                  templateUrl: 'views/search.html',
                  controller: 'categoryCtrl'
                },
                'footer': {
                  templateUrl: 'views/footer.html'
                }   
            }
        })
        .state('company', {
            url: '/company/:id',
            views: {
                '': {
                    templateUrl: 'views/company.html',
                    controller: 'companyCtrl'
                },
                'about@company': {
                  templateUrl: 'views/company-tabs/about.html'
                },
                'testimonials@company': {
                  templateUrl: 'views/company-tabs/testimonials.html'
                },
                'questions@company': {
                  templateUrl: 'views/company-tabs/questions.html'
                },
                'contacts@company': {
                  templateUrl: 'views/company-tabs/contacts.html',
                  controller: 'yaMapCtrl'
                },
                'form@company': {
                  templateUrl: 'views/form.html',
                  controller: 'formCtrl'
                }
            }
        })
        .state('news', {
            url: '/news',
            views: {
                '': {
                    templateUrl: 'views/news.html',
                    controller: 'newsCtrl'
                }
            }
        })
    .state('events', {
        url: '/events',
        views: {
            '': {
                templateUrl: 'views/events.html',
                controller: 'eventsCtrl'
            }
        }
    });
})

我可以同时看到来自公司和事件状态的“视图”,而我的主 html 页面中只有一个视图调用

    <div ui-view=""></div>

请帮忙

标签: angularjsangular-ui-routerangular-ui

解决方案


推荐阅读