angularjs - 如何在 AngularJS 中使用递归包含构建嵌套树

Question

我正在尝试在 AngularJS 中构建一些递归地包含自身的东西。每个WorkflowProcess人都有孩子WorkflowProcess，我希望树被无限包括在内。

目前它看起来像：

应该是显示...

Approval
   |
   ---------
           |
      Impositioning

这是我的模板：

<div>
    <select ng-model="workflow" ng-options="workflow.name for workflow in workflows"></select>
</div>
<div class="tree">
    <ul>
        <div ng-repeat="workflowProcess in workflow.workflowProcesses" ng-include="'/partials/admin/workflow-tree-node.htm'"></div>
    </ul>
</div>

工作流树note.html

<li ng-repeat="childWorkflowProcess in workflowProcess.workflowProcesses">
    <a>{{childWorkflowProcess.entity.name}}</a>
    <ul>
        <ng-include src="'/partials/admin/workflow-tree-node.htm'" />
    </ul>
</li>

它一遍又一遍地显示“强加”。我认识到这是因为 html 中的循环引用了相同的数据。我不确定如何让它只引用下一层数据。

每个工作流都有一个属性workflowProcesses。

Answer 1

我认为你只需要改变

<li ng-repeat="childWorkflowProcess in workflowProcess.workflowProcesses">
<a>{{childWorkflowProcess.entity.name}}</a>

至

<li ng-repeat="workflowProcess in workflowProcess.workflowProcesses">
<a>{{workflowProcess.entity.name}}</a>

将变量替换为子树中的子项。