Question

我有一个angularjs SPA应用程序，其index.html页面作为主模板，其余视图作为子视图加载到ng-view标记中。我正在为网站使用twitter引导程序模板，因此模板的登录页面与其他页面不同。有没有办法拥有多个主模板页面，一个用于登录页面，另一个用于其他所有页面？我一直试图弄清楚如何在路由提供程序中指定不同的页面，但我无法弄清楚如何指定页面而不是部分视图作为templateURL，或者甚至可能。

我是angularjs的新手，所以我不确定处理这种情况的最佳方法是什么。

由于

Answer 1

您使用RouteProvider

走在正确的轨道上

angular.module('mymodule', ['ngRoute'])

.config(function($routeProvider) {

    $routeProvider.
        when('/index.html/page1/', {templateUrl : './templates/template1.html'}).
        when('/index.html/page2/', {templateUrl : './templates/template2.html'}).
        otherwise({redirectTo : '/index.html/page1/'});
});

Answer 2

您必须使用ng-include执行此操作。您的主视图应该看起来像

<body ng-app>
    <div id='topNav' ng-include='templateUrl' ng-controller='topNavController'></div>
    <div id='left' ng-include='templateUrl' ng-controller='leftNavController'></div>
    <div ng-view>
</body>

templateUrl可以来自服务器，也可以使用<script>标记预先加载到客户端。

javascript看起来像。

function topNavController($scope, $route, $location) {
     //Check using $route or $location if login view is loaded
    // if yes $scope.templateUrl='loginTopNavTemplateUrl'
    //else $scope.templateUrl='mainNavTemplateUrl'
}

检查ng-include，$route和$location的文档，了解这些元素的工作原理。

AngularJS应用程序多页

2 个答案: