javascript - 尽管 ng Include angularjs 不会显示 html 父内容

Question

我有这两个用于 TreeView 的模板，我想使用第一种方法，但似乎有问题或者我错过了一些东西。

第一种方法(理想但行不通)
TreeTemplate.html

<ul>
    <li ng-repeat="node in c.model" style="list-style-type: none;" ng-include="'/_Core/DirectiveCore/Tree/NodeTemplate.html'">
        {{node.text}} <!--It wont show up , the problem is here, any tags will not show up in result-->
    </li>
</ul>

NodeTemplate.html

<ul ng-if="node.nodes">
<li ng-repeat="node in node.nodes" style="list-style-type: none;" ng-include="'/_Core/DirectiveCore/Tree/NodeTemplate.html'">
    {{node.text}}
</li>

<li></li> 中的所有内容在 TreeTemplate.html 中不会显示 ng-include 的想法

第二种方法(不理想但有效)

树模板.html

<ul>
<li ng-repeat="node in c.model" style="list-style-type: none;" ng-include="'/_Core/DirectiveCore/Tree/NodeTemplate.html'">
   <!--there is not any tag here!-->
</li>

NodeTemplate.html

    {{node.text}}
<ul ng-if="node.nodes">
    <li ng-repeat="node in node.nodes" style="list-style-type: none;" ng-include="'/_Core/DirectiveCore/Tree/NodeTemplate.html'">
        {{node.text}}
    </li>
</ul>

请帮我弄清楚发生了什么。

Answer 1

ng-include 属性将 li 中的所有内容替换为 NodeTemplate 中的内容。这就是您的 {{node.text}} 未显示的原因。

你的第二种方法几乎是理想的，我不明白你为什么不喜欢它。据我所知，NodeTemplate 应该是树中的单个节点，这意味着它也应该负责渲染节点文本。

我只需删除 li 中的 {{node.text}} 即可，因为它将被 ng-include 替换>:

{{node.text}}
<ul ng-if="node.nodes">
  <li ng-repeat="node in node.nodes" style="list-style-type: none;" ng-include="'/_Core/DirectiveCore/Tree/NodeTemplate.html'" />
</ul>