angularjs - 如何使用 AngularJS 以相反的顺序导航树

标签 angularjs data-structures

我在 Controller 中声明了以下数据结构:

$scope.tree = {
    label:"A",
    parent:{
        label:"B",
        parent:{
            label:"C"
        }
    }
};

我最终想要的是:

<ul>
  <li>C
    <ul>
      <li>B
        <ul>
          <li>A</li>
        </ul>
      </li>
    </ul>
  </li>
<ul>

我尝试了各种方法来做到这一点,包括外部模板、自定义指令等,但我似乎无法让它工作。

有什么想法吗?

最佳答案

在您在评论中链接到的另一个答案中,我们使用 ng-repeat 指令为模板创建新范围。

也许,您可以通过将 parent 属性包装在数组 [...] 中,用数据模仿此行为:

Controller

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.tree = {
    label:"A",
    parent:{
      label:"B",
      parent:{
          label:"C"
      }
    }
  };
});

html

<ul ng-repeat="field in [tree]" ng-include="'tree.html'"></ul>

模板

<li>
  <div>{{field.label}} {{[field.parent]}}</div>
  <ul ng-if="field" ng-repeat="field in [field.parent]" ng-include="'tree.html'"></ul>
</li>

这里是骗子的链接:http://plnkr.co/edit/7shibX0leK1TXVl5kfPc?p=preview

更好的解决方案是创建您自己的 ng-include 并将您的子对象传递给它。

关于angularjs - 如何使用 AngularJS 以相反的顺序导航树,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25044253/

相关文章:

javascript - 如何将 $scope 变量绑定(bind)到 AngularJS 中的普通变量?

angularjs - 从 Angular (时区)到服务器(UTC)然后UTC到时区的日期

asp.net-mvc - 带有 MVC 的 AngularJS 模板

java - 如何从二叉搜索树按字母顺序打印?

algorithm - 需要以下分布的算法

angularjs - Angular 无法实例化模块

javascript - angularjs $http.jsonp 成功数据在其他地方访问它

java - 如何高效返回半径内的道路

java - 从整数创建区间

javascript - 如何计算数组中的重复值并存储在数组中