angularjs ui-router傳值

首先我們了解一下ui-router.

ui-router引入狀態機制，將路由抽象概括成一個個的狀態。其中狀態里包含多種屬性 state,url,params等多種內容。

state：當前路由所處的狀態

url：當前路由對應的url正則路徑

params：傳遞的參數

當然了還有views,templates,abstract等屬性，但由於和傳參無關，因此不再介紹。

 

在ui-router中，state可以映射對應url，同樣的url也可以映射到state。我們考慮的無非是使用

url或者state傳值。

$stateProvider
.state('home',{
    url:'/home',
    params: ''
     } 
)                            

如上所示案例，當前state是home，url地址是/home。

1、url傳值

 url:'/home/:userID',
 url:'/home/{userID}'

常見方法有:param或者{param}兩種方式。如當我們設置url  ‘/home/235’時，可以獲取userID=235的參數信息。

2、state傳值

ui-sref='home({userID:235})'
$state.go('home',{userID:235})

常見的state傳值的有以上兩種，也可以歸為一種，只是表面形式看起來不同而已。

url傳值，state傳值 個人感覺最大的區別時在於跳轉的情境中。

如a頁面將參數A傳遞到b頁面，state傳值想要正常打開b頁面，只能從a頁面進入，或者說從a頁面的狀態進入，否則便獲取不到A參數。然而url傳值則可以 不經過A頁面直接獲取到參數A。

 

3、params傳參

我們也可以直接定義params里的參數列表

params:{
    userID:XXX                
}

但是此種傳參的方法局限性比較大，適合需要設置初始化值的參數，后續可以在controller中修改參數的取值。