如何使用帶狀態助手的角度ui路由器訪問「當前」嵌套狀態

Question

我正在嘗試使用StateHelper（請參閱下面的示例JSON）使用AngularJS UI路由器庫動態繪製嵌套的導航結構。

我正在努力尋找一種方法來訪問我的嵌套模板中的兒童數組。有沒有辦法訪問與當前模板/控制器相關的狀態？

我嘗試使用$state.current，但這不起作用，因爲它在每個嵌套級別解析爲相同的值（正確）。我需要能夠訪問「當前」狀態，即當前正在呈現的狀態。

任何想法非常歡迎！

nested.html

<ul class="nav nav-tabs"> 
    <li ng-repeat="tab in children" ui-sref-active="active"> 
     <a data-ui-sref="{{tab.name}}" ng-bind-html="tab.name"></a> 
    </li> 
</ul> 
<br /> 
<div data-ui-view></div> 

實施例導航

[{ 
    "name": "root", 
    "template": "<ui-view/>", 
    "children": [ 
     { 
      "name": "a", 
      "url": "/a", 
      "templateUrl": "static/partials/nested.html", 
      "children": [{ 
        "name": "1", 
        "url": "/1", 
        "templateUrl": "static/partials/nested.html", 
        "children": [{ 
          "name": "i", 
          "url": "/i", 
          "template": "Content for root.a.1.i" 
         }, { 
          "name": "ii", 
          "url": "/ii", 
          "template": "Content for root.a.1.ii" 
         }] 
       }, { 
        "name": "2", 
        "url": "/2", 
        "templateUrl": "static/partials/nested.html", 
        "children": [{ 
          "name": "i", 
          "url": "/i", 
          "template": "Content for root.a.2.i" 
         }, { 
          "name": "ii", 
          "url": "/ii", 
          "template": "Content for root.a.2.ii" 
         }] 
       } 
      ] 
     }, { 
      "name": "b", 
      "url": "/b", 
      "template": "Content for root.b" 
     }] 
}] 

Answer 1

有一個名爲$uiView附接到UI視圖元素的數據字段，其包含的視圖名稱和關聯state。你可以得到state這樣的：

elem.closest('[ui-view]').data('$uiView').state 

甚至

elem.inheritedData('$uiView').state 

所以，在你controller：

.controller('State1Ctrl', function ($state) { 
    console.log(elem.closest('[ui-view]').data('$uiView').state); // state1 
}); 

看看這可以幫助你。而且採用ui-sref，它是可能的：

<ul class="nav nav-tabs"> 
    <li ng-repeat="tab in children" ng-class="{ active: $state.current == 'tab.name' }"> 
     <a data-ui-sref='tab.name' ng-bind-html="tab.name"></a> 
    </li> 
</ul> 

這裏tab.name被認爲包含你的狀態。