在angularjs mvc应用程序中维护两种不同的布局

app.config(function($routeProvider) {
  $routeProvider
    .when('/layout1', {
      templateUrl: 'views/layout1.html',
      controller: 'Layout1Controller'
    })
    .when('/layout2', {
      templateUrl: 'views/layout2.html',
      controller: 'Layout2Controller'
    })
    .otherwise({
      redirectTo: '/layout1'
    });
});

app.directive('layoutSwitcher', function() {
  return {
    restrict: 'E',
    template: '<div ng-include="getLayoutTemplate()"></div>',
    controller: function($scope) {
      $scope.layoutType = 'layout1';

      $scope.getLayoutTemplate = function() {
        return $scope.layoutType === 'layout1' ? 'views/layout1.html' : 'views/layout2.html';
      };
    }
  };
});