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

我试图在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>

工作流树注释.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>

{{childWorkflowProcess.entity.name}

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

---

每个工作流都有一个属性

WorkflowProcesss

，我认为您只需要更改

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

{{childWorkflowProcess.entity.name}

到

{{workflowProcess.entity.name}

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

签出：。经批准的答案中的细微差别足以使它发挥作用。

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