注意：（#/shouye ， #/gouwuche ， #me 爲同一項目下的xml文件，界面當中 以{{name}} 的方法獲取值）
<!DOCTYPE html>
<html><head>
<meta charset="UTF-8">
<title>配置路由</title>
<script type="text/javascript" src="js/angular.min.js" ></script>
<script type="text/javascript" src="js/angular-route.js" ></script>
<style>
ul{
list-style: none;
}
a{
text-decoration: none;
color: red;
}
</style>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<ul>
<li><a href="#/shouye">首頁</a></li>
<li><a href="#/gouwu">購物車</a></li>
<li><a href="#/me">我的</a></li>
</ul>
<br />
<ng-view></ng-view>
<script type="text/javascript">
var mk = angular.module("myApp",["ngRoute"]);//將路由對象注入模塊
mk.controller("myCtrl",function($scope){
//要傳到其他界面的值
$scope.name = "郭大哥的";
})
//配置路由
mk.config(function($routeProvider){
$routeProvider.when("/shouye",{templateUrl:"shouye.html"}).when("/gouwu",{templateUrl:"gouwuche.html"}).when("/me",{templateUrl:"me.html"})
})
</script>
</body>
</html>