angularjs ui-router傳值

標籤：擷取   區別   url   包含   需要   home   開啟   div   UI   

首先我們瞭解一下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中修改參數的取值。

angularjs ui-router傳值