Question

我有一个包含ui-view的页面。当您访问该页面（/ user /）时，它默认将/ user / login模板加载到视图中。您可以点击注册，这会将注册（/ user / signup）模板加载到视图中。但是，如果您直接转到/ user / signup，它会显示准系统表单。当用户进入/ user / signup时，是否可以使用注册模板（在视图中加载）显示/ user页面？

相关代码：

/user.ejs：

<html>
<body ng-app="myapp">
  <div ui-view="container" class="auth-container">
    <span>Sign in</span>
    <form ng-submit="login()">
      <div class="form-group">
        <input type="text" ng-model="user.email" autofocus>
      </div>
      <div class="form-group">
        <input type="password" ng-model="user.password">
      </div>
      <button type="submit" class="btn btn-primary">Log In</button>
    </form>
    <a ui-sref="signup">Sign Up</a>
  </div>
</body>
</html>

/public/javascripts/authController.js

var app = angular.module("myapp.auth", ["ui.router"]);

app.config([
  "$stateProvider",
  function($stateProvider) {
    $stateProvider.state("user", {
      parent: "root",
      url: “/user”,
      templateUrl: "/welcome",
      controller: "AuthController",
    })
    .state("login", {
      parent: "root",
      url: "/user/login",
      views: {
        "container@": {
          templateUrl: "welcome/login",
          controller: "AuthController"
        }
      }
    })
  }
]);

欢迎/ login.ejs：

<span>Sign in</span>
<form ng-submit="login()">
  <div class="form-group">
    <input type="text" ng-model="user.email" autofocus>
  </div>
  <div class="form-group">
    <input type="password" ng-model="user.password">
  </div>
  <button type="submit" class="btn btn-primary">Log In</button>
</form>
<a ui-sref="signup">Sign Up</a>

最后，node.js路由：

var express = require("express");
var router = express.Router();

router.get("/user", function(req, res, next) {
  res.render("user", {
    title: "Express"
  });
});

router.get("/user/login", function(req, res, next) {
  res.render("auth/login", {
    title: "Express"
  });
});

因此，如果我转到localhost/user，它会直接在ui视图中加载login视图。但是，如果我转到localhost/user/login，它会加载并仅显示login.ejs的内容，而不包含user.ejs模板的任何部分。

我真正想要的是以下内容：

用户转到localhost/user。 Angular发现没有请求任何特定模块，因此显示user.ejs并自动将login.ejs视图加载到ui-view。
用户转到localhost/user/login。 Angular看到login已被请求，因此它显示user.ejs并将login.ejs加载到ui-view中。
用户转到localhost/user/register。 Angular看到signup已被请求，因此它显示user.ejs并将signup.ejs（此处未显示）加载到ui-view中。

任何指针？

Angular加载没有父模板的单个视图

0 个答案: