比如说，我有一个组件，其用途如下：
<health-renderer
[health]="getHealth()"
[label]="label">
<health-renderer>
阅读数据绑定相关部分后https://angular.io/guide/template-syntax，这似乎是我设置目标组件属性的方式health是错误的，因为使用的模板表达式是getHealth()这是一种方法。并且方法绑定只能通过事件来完成，而不是通过属性来完成。换句话说，模板表达式（右侧的东西）=) 需要是模板变量、模板引用变量或组件/指令/元素属性。
If [target]="methodCall()"是一种错误的绑定方式，那么为什么 Angular 允许这种方式呢？如果这是进行绑定的正确方法，那么我在上一段中给出的理解是否错误？
另外，我应该如何修改我的代码以反映正确的内容：
- 显示当前的健康状况，也就是说，只是一个进度条
- 自动呼叫
getHealth(): integer其中包含用于计算健康状况的业务逻辑。 0 将不会在健康进度条上显示任何内容。 100 将填满进度条。
最后，我注意到每次鼠标移动或单击时，getHealth() 都会无缘无故地被调用 10-20 次。由于 Angular 的这种更改检测行为，将方法绑定到目标属性可能不是一个好的做法？
如果您知道自己在做什么，那么可以使用方法调用作为表达式。这是报价从文档:
尽管可以编写非常复杂的模板表达式，
你应该避开它们。
属性名称或方法调用应该是常态。
正如您所注意到的，Angular 在每次更改检测运行时都会执行表达式，因此您的函数将经常执行：
Angular 在每次更改检测后执行模板表达式
循环。变更检测周期由许多异步触发
活动，例如承诺决议、http 结果、计时器事件、
按键和鼠标移动。
因此，最好尝试用表达式中的直接属性访问来替换方法调用。如果您的函数执行以下操作：
getHealth() {
return this.health;
}
你可以输入：
[health]="health"
在这里阅读有关变更检测的更多信息：
- 关于 Angular 中的变更检测您需要了解的一切
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
