显示为列表的层次结构ng-repeat

我是AngularJS的新手，但我非常享受迄今为止的工作。我用AngularJS的NG-重复的HTML，其中一个节点的孩子放在内节点的标记，这样创建的树结构：显示为列表的层次结构ng-repeat

<div class="parent"> 
    I am the parent node. 
    <div class="child"> 
     I am a child node. 
     <div class="child"> 
      I am a grandchild. 
      etc... 
     </div> 
    </div> 
</div>

但想什么，我做的反而是使用相同的数据（树）来做这样的标记：

<div class="parent">I am the parent</div> 
<div class="child">I am a child</div> 
<div class="child">I am a grandchild</div> 
<div class="child">I am a great-grandchild</div> 
etc....

即，列表。我想出了这样做的唯一途径是通过我叫visibleDescendants容器对象，这使得一个数组，看起来很像这创造了一种新方法：

this.visibleDescendants = function(a) { 
    if (!a) a = []; 
    if (this.selected()) { 
    a.push(this); 
    if (this.hasChildren()) { 
     this.children().forEach(function(child) { 
     if (child.selected()) { 
      a = child.visibleDescendants(a); 
     } 
     }); 
    } 
    } 
    return a; 
};

，然后设置控制器/模板像这样：

$scope.visibleDescendants = $scope.container.visibleDescendants(); 
<div ng-repeat="column in visibleDescendants">...</div>

，然后其中一个节点设置为selected(false)每一次，我重置$ scope.visibleDescendants。

与其他我一直在阅读/使用AngularJS的东西相比，这看起来效率不高，也不是非常习惯。我希望能够找到一种方法在模板部分中更加声明性地做到这一点。请帮忙！

来源

2013-02-18 tjb1982

不久前我回答了simillar问题：http://stackoverflow.com/questions/14921992/angularjs-ng-repeat-on-two-levels-but-just-one-output/14922966#14922966 hope这有助于。 – 2013-02-18 20:07:31

我认为我真正想要做的是一个介绍的问题，不应该影响标记。换句话说，数据和标记应该在结构上/语义上匹配;只有CSS应该改变它的外观。

这就是说，我不认为这是明智的混乱重建数据用于演示目的。

来源

2013-02-18 22:30:57 tjb1982

显示为列表的层次结构ng-repeat

回答

相关问题