angularjs - 在Angularjs中路由到不同的页面？
问题描述
我正在尝试创建一个链接，在该链接中单击注册按钮并进入 register.html，而不需要页面开始重新加载。但是当我单击注册链接时，单击它时似乎没有任何反应。
索引.html：
<!DOCTYPE html >
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="myApp" ng-controller="Login">
<label for="login">Login</label>
<input id="login" ng-model="login" type="text">
<br>
<label for="password">Password</label>
<input id="password" ng-model="password" type="text">
<br>
<button type="button" ng-click="login()">Login</button>
<a href="#!register" >Register</a>
<div ng-view></div>
</body>
</html>
应用程序.js：
var app=angular.module("myApp",["ngRoute"]);
app.config(function ($routeProvider) {
$routeProvider
.when("/",{
templateUrl:"index.html",
})
.when("/register",{
templateUrl:"register.html",
controller:"Registration"
});
})
app.controller('Login',['$scope', function ($scope) {
}])
app.controller("Registration", function ($scope) {
$scope.msg = "I love London";
});
注册.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<h1>Registration page</h1>
</head>
<body ng-app="myApp" ng-controller="Registration">
</body>
</html>