Question

我正在为我的网络应用程序使用ui-router，我已经定义了3种不同的视图：标题，内容和菜单。

当我从菜单中选择一个链接时，我只想重新加载内容视图，页面的其余部分应保持不变。这是我的路线配置：

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
    $locationProvider.html5Mode(true);

    $stateProvider.state('', {
        url: '/name=:name',
        views: {
            header: {
                templateUrl: '/new/app/components/header/headerView.html',
                controller: 'HeaderController'
            },
            content: {
                // only this one should reload itself on url change.
                templateUrl: '/new/app/components/content/contentView.html',
                controller: 'ContentController'
            },
            menu: {
                templateUrl: '/new/app/components/menu/menuView.html',
                controller: 'MenuController'
            }
        }
    });
}
]);

在html中，我已经定义了这样的视图：

    <div ui-view="header"></div>
    <div ui-view="content"></div>
    <div ui-view="menu"></div>

如何定义配置文件以仅重新加载“内容”视图？

Answer 1

我会为您的header和menu创建指令，或者使用ng-include而不是使用ui-view或将它们放入您的状态配置

<div site-header></div>
<div ui-view="content"></div>
<div site-menu></div>

如何在Angular上的url更改中仅重新加载一个控制器？

1 个答案: