背景介紹
什么是ui-router？，
AngularUI Router是AngularUI 團隊開發的一個AngularJS路由模塊，相比AngularJS的標准路由ngRoute，它更靈活。與集成的ngRoute服務不同的是，UI-Router可以將視圖嵌套，因為它基於的是操作狀態而僅非URL。
與傳統做法使用ng-view不同的是，在ui-Route里需要使用ui-view服務。當在ui-router中處理路由和狀態時，開發者的重心是當前的狀態是什么以及在哪一個頁面里。
UI-Router被認為是AngularUI為開發者提供的最實用的一個模塊，它是一個讓開發者能夠根據URL狀態來組織和控制界面UI的渲染，而不是僅僅只改變路由（傳統AngularJS應用實用的方式）。
該模塊為開發者提供了很多視圖（view）的控制。開發者可以創建嵌套分層的視圖、在同一個頁面使用多個視圖、讓多個視圖控制某個視圖等更多的功能。
即使是非常復雜的web應用，UI-Router也可以極佳地駕馭。
知識刨析
什么是router
在web開發中，router是根據jur分配到對應的處理程序，我們也可以說，路由的作用就是解析url地址，根據路由狀態，來決定當前是在那個頁面。
客戶端的請求是，以url的形式傳遞給服務器，在傳統的開發中，urld對應服務器上某個目錄上的文件。而在MVC開發則是改變了z這種對應關系，web服務器會截獲所以請求，不會檢測我們的資源是否存在，直接發給網頁路由器，路由器在調用相關的控制器，控制器d調用相關的服務，然后路由器再從視圖對象中，提取生好的網頁代碼返回web服務器最終返回客戶端。
為什么要使用路由呢？
在傳統的web開發中，每一個請求地址都會讓服務器去進行處理，但是用戶有些操作時無需請求服務的，直接頁面端修改一下邏輯就可以達到目的。這種情況下我們最好的方法就是使用路由。
也許有人會問，這個時候，我們直接使用js去處理不就行了，使用js直接處理時可以的。事實上之前也是這么干的。但是這樣做不方便用戶收藏當前頁面。因為js時不會更強url地址的。
但是我們使用路由的話，url隨着改變的，用戶瀏覽到網頁可以直接進行復制，或者是收藏當前頁的url給別人，這樣無論是對用戶還是對搜索引擎來說，都i是友好的。
簡單的說，不使用路由的話，使用js加載頁面會導致，在用戶體驗上面會是一場在災難。你能想象的出，你找到一篇博客，然后無法把內容的地址給保存下來的感覺嗎？
常見問題，
如何使用，angular ui-router。
解決問題
方法1，我們使用包管理器，yarn，bower，npm這種來使用命令行進行安裝。
方法2，bootcdn，引入文件。注（在此之前我們必須要引入jquery，與angular.js）
第二步，搭建我們的路由。
在此之前，我們必須要保證，自己引入的文件順序以及cdn可以正常訪問。可以在谷歌瀏覽器里，f12，network里面查看。
此后，html於js，聲明angular.js主模塊，並把ui-router傳入主模塊。
<html lang="en" ng-app="myApp">
var myApp = angular.module("myApp",['ui.router']);
下面， 聲明$stateProvider,並且把$urlRouteProvider ,作為路由引擎作為函數參數傳入。
myApp.config(function ($stateProvider,$urlRouterProvider) {
默認路由頁面。如果沒有路由引擎能匹配當前的導航轉來，就默認講展示background頁面。
$urlRouterProvider.when("", "/background");
頁面加載好，被第一個使用的路由。
.state("background",{
url:"/background",//url地址
templateUrl:"vivw/background.html",//加載的html模板
})
angualr uirouter最強大的地方，在於，可以使用它去跳轉傳參，以及可以進行路由嵌套。
我們先說路由嵌套。
嵌套視圖時ui-router於ng-router最大的區別，這也是備受青睞的原因。
在使用嵌套視圖的時候，我們必須要的子視圖之前必須加上上一層視圖的狀態名。
.state("background.login",{
url:"/login",
templateUrl:"vivw/login.html."
})
background頁面需要設置，vive，為了發給其他視圖顯示的地方。
使用跳轉傳參的話，我們需要注意的點在於，首先在路由上面parms，或者url，parms設置要接受的參數，並且值為null。
.state("red",{
url:"/red",
params:{"test":null},
templateUrl:"vivw/red.html",
})
然后·我們在目標頁面的控制器里面注入$stateparms獲取參數就行了。
myApp.controller("red",function ($scope,$state,$stateParams) {
$scope.skip=function () {
$state.go("background.login")
};
$scope.look=function () {
console.log($stateParams);
console.log($stateParams.obj);
}
});
擴展思考
那么什么是，url呢？
uri俗稱網頁地址，直譯的話，是統一資源定位符。但是網頁地址並不是http，和https，網址url，和鏈接lick，超鏈接hyperlinkk。關系有些微妙。
uri的意思是統一資源標識符，在互聯網中就是通過uri來訪問互聯網資源的，uri分出來了2個子集，一個是我們常常聽到提起的，url，另一個就是urn。
uri更傾向於，標識我們的這個資源是什么東西。
url跟urI的的名字有點接近，是統一資源定位符，我們可以通過url，准確的定位一個資源的位置，並且去訪問它，url地址就是該文件在服務器的根目錄的相對路徑。
urn，是表示一個實體的標記符，但是不能給你資源的位置，我不知道這個資源在哪，但是我知道這個資源的名字
，id，我就可以找到你。
更多討論
Q1：
ng-router和ui-router有什么區別？
A1：
ngRoute在路由配置時用$routeProvider。
ui-router路由配置時用 $stateProvider 和$urlRouterProvider。
ngRoute是官方路由。
ui-route是第三方路由。
ngroute是用AngularJS框架的核心部分。
ui-router是一個社區庫，它是用來提高完善ngroute路由功能的。
ui-router允許嵌套視圖(nested views)和多個命名視圖(multiple named views)。