当存在递归调用时，angular如何呈现模板？

我试图实现一个简单的目录菜单，其中目录可以有子目录，并且是父目录的一部分

然而，当我实现递归模板时，会发生一件非常奇怪的事情，每当我单击一个

元素时，就会调用函数

doSomething

，为什么会发生这种情况？这是否意味着每次单击任何

元素时，都会反复渲染元素？这不是内存泄漏吗

模板：

<ul>
  <li *ngFor="let d of dirs" (click)="clicked()">
    {{d.name}}
    <ul>
      <hello
        *ngIf="d.dirs && d.dirs.length>0"
        [dirs]="d.dirs"
        [some]="doSomething()"
      ></hello>
    </ul>
  </li>
</ul>

完整代码在这里

---

这与传播无关，之所以会发生这种情况，是因为您绑定的是函数表达式而不是声明，将其更改为此即可：

---

您正在递归调用组件：

selector: 'hello',

在“hello”组件的HTML模板/视图中，您再次在其内部调用它：

...
  <ul>
     <hello ...

。。。

我认为在这种情况下，您需要停止事件的传播，因此单击
元素被视为一种变化检测？另外，[some]=“doSomething”和[some]=“doSomething（）”之间的区别是什么？为了回答这个问题，我必须解释更多关于变化检测机制的信息，我用更多信息编辑了我的答案。好的，谢谢，我会读到的。我知道它与数据绑定有关，但我不是前端开发人员，谢谢你的回答：）好的，现在更清楚了：）你能再解释一下吗？为什么单击一个
组件会在父组件内创建一个新实例？每次递归调用都会创建一个新的完整组件和一组完整的dir，因此，每次单击都会触发其中的任何内容。您可以验证您的孩子fn。树越深，调用重新出现的次数就越多。您需要对单个节点进行递归调用，而不是对整个树结构进行递归调用。
...
  <ul>
     <hello ...