Question

var app = angular.module("Signup", ['ngRoute', "ngAnimate"]);

app.config(function($routeProvider) {
    $routeProvider
        .when('/signup', {
            templateUrl: "/views/signup.html",
            controller: "FormCtrl"
        })
        .when('/otp', {
            templateUrl: "/views/otp.html",
            controller: "FormCtrl"
        })
        .when('/password', {
            templateUrl: "/views/password.html",
            controller: "FormCtrl"
        })
        .when('/identity', {
            templateUrl: "/views/identity.html",
            controller: "FormCtrl"
        })
        .otherwise({
            redirectTo: '/signup'
        });
});

app.controller("FormCtrl", [function() {
    var store = this;
    store.usersData = [];

    store.newuser = {

    };
    this.submit = function() {
        store.usersData.push(store.newuser);
        console.log(store.usersData);
        store.newuser = {};
    };
}]);

我的视图文件夹中有四个模板，即otp.html，password.html，identity.html，signup.html

我有一个index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <base href="/index.html">
    <title>Sign Up | Rupaiya Exchange</title>
    <link rel="stylesheet" href="assets/icons/font-awesome-4.7.0/css/font-awesome.min.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="assets/css/signupform.css">
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js" charset="utf-8"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular-route.min.js" charset="utf-8"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-animate.min.js" charset="utf-8"></script>
  </head>
  <body ng-app="Signup">
    <a href="#/otp">Signup</a>
    <div ng-view></div>
    <!-- <script type="text/javascript">
      document.getElementById('showPswd').addEventListener("click", function() {
          var pwd = document.getElementById("newPassword");
          if (pwd.getAttribute("type") === "password") {
              pwd.setAttribute("type", "text");
          } else {
              pwd.setAttribute("type", "password");
          }
      });
    </script> -->
    <script src="assets/js/signup.js" charset="utf-8"></script>
  </body>
</html>

但只有加载注册页面。

我已经检查了我的代码，几乎可以在google的首页上找到关于路由和视图的教程，但没有任何工作。

我也没有收到任何错误。

此外，点击链接<a href="#/otp">Signup<a>后，我的网址会更改为此http://127.0.0.1:36164/#!/signup#%2Fotp

ngRoute只加载一个视图

0 个答案: