什麼是路由？
路由是AngularJS建構單頁面應用的基礎。
路由，就是網絡資料或者請求進行分發的一個網絡元件。
路由就是一個用于請求URL分發和跳轉的一個應用元件，Angular中通過$routeProvider路由服務提供者進行核心的配置處理。
ng路由
ng 路由是 AngularJS 官方提供的一種簡單的路由操作。
ng 路由主要分三個組成部分：路由指令、路由服務、路由服務提供者
$when **************** $state 路由狀态配置的差別
$routeParams ******** $stateParams 帶參數的時候的配置差別
$routeProvider ******** $stateProvider 依賴注入的子產品的差別
<div ng-view></div>******** <div ui-view></div> 頁面中綁定的指令的差別
此外 ng是官方提供的，而ui是第三方提供的，适合項目中涉及大量嵌套子產品時去使用，功能非常強大，它支援一切正常ng-route也可以做許多額外的功能。
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>系統單頁面</title>
<!-- 引入核心架構檔案 -->
<script src="../js/lib/AngularJS/angular.min.js"></script>
<!-- 引入Angular路由子產品檔案 -->
<script src="../js/lib/AngularJS/angular-route.js"></script>
</head>
<body>
<!-- 在Angular1.5之前，錨連結跳轉，使用#/開頭即可 -->
<!-- 在Angular1.5開始，錨連結跳轉，使用#!/開頭即可 -->
<ul>
<li><a href="#!/" target="_blank" rel="external nofollow" >首頁</a></li>
<li><a href="#!/login" target="_blank" rel="external nofollow" >登入</a></li>
<li><a href="#!/regist" target="_blank" rel="external nofollow" >注冊</a></li>
<li><a href="#!/shopcart" target="_blank" rel="external nofollow" >購物車</a></li>
</ul>
<!-- 指定顯示模闆的位置 -->
<div ng-view></div>
<script>
var app = angular.module("myApp", ["ngRoute"]);
/*
route:路由
provider:提供者
$routeProvider:AngularJS提供的用于進行路由配置的内置服務
app.config()函數主要用于進行《配置資訊》的添加
*/
app.config(["$routeProvider", function($routeProvider) {
$routeProvider
.when("/", {
templateUrl:"template/main.html"
}).when("/login", {
templateUrl:"template/login.html"
}).when("/regist", {
templateUrl:"template/regist.html"
}).when("/shopcart", {
templateUrl:"template/shopcart.html"
}).otherwise("/");
}]);
</script>
</body>
</html> ![Angular form學習筆記[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)