UI-Router：防止訪問父狀態

Question

我正在轉移到UI-Router作爲我的應用程序路由器。我想下面以嵌套狀態：

$stateProvider 
.state('app', { 
     url: '/app', 
     template: ' <div ui-view></div>', 
     authenticate: true 
    }) 
.state('app.state1', { 
     url: '/state1', 
     templateUrl: 'app/state1.html', 
     controller: 'State1Ctrl', 
     controllerAs: 'state1', 
     authenticate: true 
    }) 
.state('app.state2', { 
     url: '/state2', 
     templateUrl: 'app/state2.html', 
     controller: 'State2Ctrl', 
     authenticate: true 
    }) 

我$state稱爲app是別人的父母。它只包含一個<div ui-view></div>模板。它不應該直接訪問。我的意思是如果用戶在URL中輸入/app，他們應該被重定向到`app.state1``

如何防止我的用戶這樣做？

Answer 1

有a working example

讓你的狀態abstract：

.state('app', { 
     url: '/app', 
     abstract: true, // here 
     template: ' <div ui-view></div>', 
     authenticate: true 
    }) 

，並添加一些默認重定向：

$urlRouterProvider.when('/app', '/app/state1'); 
    $urlRouterProvider.otherwise('/app/state1'); 

第2頁下面的鏈接將重定向到「app.state1 '

<a href="#/app"> // will be redirected to state1 
<a href="#/app/state1"> 
<a href="#/app/state2"> 

的doc about $stateProvider：

abstract（可選）boolean

一種抽象狀態將永遠不會被直接激活，但可以提供繼承屬性，將其共同的孩子的狀態。

檢查它here