Angular UI 路由器，如何从控制器获取当前状态的祖先列表？

Question

我的状态层次结构是（从上到下）：

1. root
2. account
3. account.invoices
4. account.invoices.detail

当我处于 account.invoices.detail 状态时，我想获取祖先状态列表：

angular
    .module('app')
    .controller('InvoiceDetailCtrl', ['$scope', '$state', function ($scope, $state) {
        var current = $state.current.name;
        // Get ancestors from current state
        // Tried $state.current.parent, $state.parent, $state.parent(current)
    }]);

Angular UI 路由器允许您转换到父状态（即从 data-ui-sref="^" 的视图），因此应该可以实现这一点（跟进链最多 root).

的祖先

我需要它来构建类似自动面包屑的功能。

编辑：由于已接受的答案，结果如此：

var current = $scope.$state.$current,
     parent = current.parent,
     ancestors = [current.name];

while (typeof parent != 'undefined' && parent.name.length) {
    ancestors.push(parent.name);
    parent = parent.parent;
}

如果你问为什么检查 parent.name.length 是因为 Angular UI 中有类似 "root" 的状态（无法获得任何相关文档） .

Answer 1

在您的控制器中：

function getParentList(state) {
 var parentList = [];
 var state = state.parent;
 while(state) {
  parentList.push(state.toString());
  state = state.parent;
 }
 return parentList;
}

var parents = getParentList($state.$current);

Answer 2

看看$state.$current.includes；它似乎 return 一个对象，其键与当前状态和父状态匹配。我相信这些都是可以通过 $state.includes() 测试的州。