如何使用AngularJS处理完全不同区域（但相同网站）的模板

我有一个带有main index.html的webapp，它通过ng视图和routeProvider显示每个页面

现在，我正在为尚未登录的用户添加一个入口页面。这个页面也可以有他自己的ng视图来为未登录的用户滑动不同的部分（欢迎，什么是，登录，注册ecc…）和他自己的css脚本ecc

我宁愿webapp索引和入口页面索引地址都指向www.example.com（因此与www.example.com/welcome不同）

我想到了一个类似的结构：

• 网络应用/
  • 主要/
  • 第1页/
  • 第2页/
  • 欢迎光临/
    • 第一节/
    • 第2节/
    • index.html
    • welcome.js（入口页面的角度模块）
  • .htaccess
  • index.html
  • webapp.js（包含webapp的routeProvider的角度模块）

目前，我有一个.htaccess，它将所有假查询重写为index.html，以便在这里处理所有问题

特别是：

1） 如果我已经将此条件用于webapp主页，那么当用户未登录时，我如何告诉webapp.js的routerProvider转到/welcome/index.html？（我应该使用run方法吗？一个简单的例子会很有帮助）

2） 如何防止将welcome/index.html中的所有内容加载到index.html ng视图中？（可能使用ng if隐藏ng视图？或者有某种方法可以通过routerProvider控制此行为？）

3） 有更好更简单的方法来实现这一切吗

谢谢

更新： 好的，我想我的问题中有一个潜在的问题。。。我不能使用完全不同的页面，因为所有内容都已加载，切换到另一个页面将导致重新加载应用程序时丢失所有数据。 所以我想我应该对整个网站使用相同的主模板。

---

然后我补充说：angularjs中有一种方法可以动态加载不同的样式表？

这个问题很老，但我认为是有效的，可以澄清一些人的想法

首先，假设您为AngularJS应用程序使用一个页面，否则您将不得不执行重定向链接之类的操作，并在other-index.html中加载一个完全不同的Angular应用程序，同时加载第一个应用程序中所需的每个脚本

1） 使用很容易，而且非常健壮，您只需要为

ui视图

准备一个容器，然后

ui路由器

将用相应的html填充容器

2） 要防止导航，应执行以下操作：

angular.module('myApp', [])
.run(function($rootScope, mySessionService){
  $rootScope.$on('$stateChangeStart',
      function(event, next, nextParams, prev, prevParams) {
        // The info of your currentUser could be obtain from a service
        // or localStorage or cookies anyway you are already doing it
        var authorized= checkAuthorization(next.authorazedRoles,             
                          mySessionService.getCurrentRol());
        if(!authorized) {
          $rootScope.$state.go('defaultState');
          // Or $rootScope.$emit('NOT_AUTHENTICATED');
          // and some service will have to implement a listener for this emit
          // $rootScope.$on('NOT_AUTHENTICATED', func..redirect to X State)
        }
      });
});

angular.module('myApp', [])
.run(function($rootScope, mySessionService){
  $rootScope.$on('$stateChangeStart',
      function(event, next, nextParams, prev, prevParams) {
        // The info of your currentUser could be obtain from a service
        // or localStorage or cookies anyway you are already doing it
        var authorized= checkAuthorization(next.authorazedRoles,             
                          mySessionService.getCurrentRol());
        if(!authorized) {
          $rootScope.$state.go('defaultState');
          // Or $rootScope.$emit('NOT_AUTHENTICATED');
          // and some service will have to implement a listener for this emit
          // $rootScope.$on('NOT_AUTHENTICATED', func..redirect to X State)
        }
      });
});