Question

我的app.js文件如下：

angular.module('airline', ['ngRoute', 'airlineServices', 'ngCookies'])
    .config(airlineRouter);

function airlineRouter($routeProvider){
    $routeProvider
        .when('/', {
            templateUrl: 'partials/destinations.html',
            controller: 'DestinationsCtrl'
        })
        .when('/airports/:airportCode', {
            templateUrl: 'partials/airport.html',
            controller: 'AirportCtrl'
        })
        .when('/airports/:airport1/:airport2', {
            templateUrl: 'partials/two_airports.html',
            controller: 'TwoAirportsCtrl'
        })
        .when('/flights', {
            templateUrl: 'partials/flights.html',
            controller: 'FlightsCtrl'
        })
        .when('/reservations', {
            templateUrl: 'partials/reservations.html',
            controller: 'ReservationsCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });
};

现在我只希望如果用户登录，我可以通过从cookie向服务器发送令牌并获得响应来轻松尝试，我希望加载视图和控制器，但如果用户不是登录后，我只想加载登录视图和登录控制器？如何配置'/'路由以便加载不同的视图和控制器？

Answer 1

视图将动态加载，因此您无需担心它们。控制器是您设置的一部分，因此您不必担心它们。您要做的是根据用户是否经过身份验证来显示视图。

当用户进行身份验证时，你想在某个地方设置一个属性，可能在$ rootScope中，然后你可以显示不同的视图，代码类似于下面的代码：

＆＃13;

<div data-ng-if="application.isAuthenticated()">

  <div>
    I am logged in

  </div>
</div>

<div data-ng-if="!application.isAuthenticated()">
  hello anon, please login.
  <button class="btn btn-primary" ng-click="application.login()">Login</button>
</div>

＆＃13;

在Angular的路由中加载不同的模板和控制器？

1 个答案: