Question

我有一个使用yeoman，grunt和bower创建的AngularJS应用程序。我正在使用Wrapbootstrap ace theme。

登录和注册页面看起来风格不同（如果你点击左侧菜单上的更多页面，可以看到它 - >登录和注册）。

我想创建多个ng-views用于登录，注册，然后为其余视图创建剩余（主页。）

这就是我所做的。我有一个 index.html 。

<html ng-app="myApp">
<head>
<!-- CSS styles -->
</head>
<body>
<div ng-view></div>
</body>
<!-- Javascript imports -->
</html>

然后登录和注册我有一些共同的风格，所以创建了一个页面 startup.html ，它有一些共同的登录和调节器风格。

<html ng-app="startup">
<head>
    <!-- CSS styles -->
    </head>
    <body>

      <!-- Some styles with div and all that are common for login and register -->
    <div ng-view></div>

     <!-- Some styles with div and all that are common for login and register -->
    <body>
    <!-- Javascript imports -->
 </html>

然后我有login.html和register.html，有一些表单元素。

<div>
<form>
<!-- form elemts -->
</form>
</div>

然后我有 home.html

<html ng-app="homeApp">
    <head>
        <!-- CSS styles -->
        </head>
        <body>

          <!-- Some styles with div and all that are common for all other pages -->
        <div ng-view></div>

         <!-- Some styles with div and all that are common for all other pages -->
        <body>
        <!-- Javascript imports -->
     </html>

然后根据菜单链接提供许多其他Html页面。

<div>
<!-- htmml codes for page -->
</div>

这是我的 app.js

var startup=angular.module('startup', []);
var homeApp=angular.module('homeApp', []);

var myApp=angular.module('myApp', ['startup', 'homeApp', 'ngCookies']);

myApp.config(['$routeProvider', '$locationProvider',
  function($routeProvider) {
    $routeProvider
    .when('/login', {
        templateUrl: 'login.html',
        controller: 'LoginController'
    })
    .when('/register', {
        templateUrl: 'register.html',
        controller: 'RegisterController'
      })
   .when('/home', {
       templateUrl: 'views/home.html',
       controller: 'homeController'
    })
   .when('/document', {
   templateUrl: 'views/document.html',
   controller: 'documentController'
    })
   .otherwise({
   redirectTo: '/login'
    });
}]);

在我的 loginController 中，如果登录成功，我将重定向到$location.path( "/home" );

startup.controller('LoginController', function($scope) {
    $scope.user = {};
    $scope.loginUser=function() {
        var username=$scope.user.name;
        var password=$scope.user.password;
        if(username=="admin" && password=="admin") {
            $location.path( "/home" );
        } else {
            $scope.message="Error";
        }
    };
});

但是当我跑步时，登录页面出现但没有 startup.html 布局。

我想要的是，当路径登录或注册时， startup.html 应该只出现 login.html 或注册.html 应该来了。对于其他路径，它应该提供 home.html 布局，并且内部将显示所有其他html页面。这样，对于登录和注册，我可以保留一个对于所有其他页面都是通用的布局，我可以保留其他 home.html 布局

我该怎么做？

AngularJS - 针对不同页面的不同ng视图

0 个答案: