5.4 View
5.4.1 view组件中的模板切换
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>5.4.1 view组件中的模板切换</title>
</head>
<body>
<div ng-app="myapp">
<div>
<a href="#/">首页</a>
<a href="#/book">图书</a>
<a href="#/game">游戏</a>
</div>
<div ng-view></div>
</div>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="http://cdn.bootcss.com/angular.js/2.0.0-beta.14/router.min.js"></script>
<script>
angular.module("myapp",['ngRoute'])
.controller("myapp_1",['$scope',function($scope){
$scope.title = "首页";
}])
.controller("myapp_2",['$scope',function($scope){
$scope.title = "图书页";
}])
.controller("myapp_3",['$scope',function($scope){
$scope.title = "游戏页";
}])
.config(["$routeProvider",function($routeProvider){
$routeProvider
.when('/',{
controller:"myapp_1",
template: "<div>{{title}}</div>"
})
.when('/book',{
controller:"myapp_2",
template: "<div>{{title}}</div>"
})
.when('/game',{
controller:"myapp_3",
template: "<div>{{title}}</div>"
})
.otherwise({
redirectTo:'/'
})
}])
</script>
</body>
</html>