<!DOCTYPE html>
<html>
<script src="https://cdn.staticfile.net/angular.js/1.6.9/angular.min.js"></script>
<script src="https://cdn.staticfile.net/angular.js/1.6.9/angular-route.js"></script>
<body ng-app="myApp">
<p><a href="#/!">主页</a></p>
<a href="#!red">红色</a>
<a href="#!green">绿色</a>
<a href="#!blue">蓝色</a>
<div ng-view></div>
<script>
var app = angular.module("myApp", ["ngRoute"]);app.config(function($routeProvider) { $routeProvider
.when("/", { templateUrl : "/demo/angular/main.html"
})
.when("/red", { templateUrl : "/demo/angular/red.html"
})
.when("/green", { templateUrl : "/demo/angular/green.html"
})
.when("/blue", { templateUrl : "/demo/angular/blue.html"
});
});
</script>
<p>点击上面的链接。</p>
<p>本示例使用 ng-view 指令作为 DIV 元素的属性。</p>
</body>
</html>