仅使用ui更改一个视图-路由器和AngularJS

Question

假设您有一个网站，它有3个不同的路由：/news、/about和/signup。

新闻和关于是它们自己的“页面”，而注册只是一个覆盖，可以在/news或/about上切换。

如果你在/news或/about上访问/signup，在注册覆盖下仍然可以看到相应的页面。如果您直接转到/signup，它会在下面显示站点的根目录(为了清晰起见，使用/news)。

这个是可能的吗？是否可以使用AngularJS和ui-router (或angular-router?)拥有多个视图和不同的路由，从而改变一个视图而保持另一个视图不变。

我看过这个链接：angularjs ui-router - how to build master state which is global across app

但它所做的似乎只是在当前路由中未声明ui-view的情况下为其定义一个默认值。

设置非常简单：

<div class="main" ui-view="main"></div>
<div class="overlay" ui-view="overlay"></div>

我想通过url激活overlay视图，而不改变main中显示的内容。

Answer 1

你的意思是签到而不是注册吗？是的，这是可能的。使用三种状态

$stateProvider.state("signup", {
    url: "/signup",
     views: {
                "overlay": {
                    templateUrl: "signup.html",
                    controller: "SignupController"
                },
                "main": {
                    templateUrl: "news.html",
                    controller: "NewsController"
                }
              }    
  })


  .state("news", {
         url: "/news",
         views: {
                "overlay": {
                    templateUrl: "signup.html",
                    controller: "SignupController"
                },
                "main": {
                    templateUrl: "news.html",
                    controller: "NewsController"
                }
              }    
  })

.state("news", {
         url: "/about",
         views: {
                "overlay": {
                    templateUrl: "signup.html",
                    controller: "SignupController"
                },
                "main": {
                    templateUrl: "about.html",
                    controller: "AboutController"
                }
              }    
  });

注册覆盖模板将在所有三种状态下加载。如果注册URL已加载(注册状态)，如果用户未登录，则显示覆盖，否则转到新闻状态。

如果用户直接转到新闻或关于URL，如果用户未登录，则显示覆盖，否则不显示覆盖

您可以使用状态解析来检查用户是否已登录，然后隐藏/显示它。