为什么必须在Component中编写Object = Object才能在Angular中获取Object.keys？

Question

在我的Angular模板中，我需要一个对象的键计数。我在模板文件中写了{{ Object.keys(myObj).length }}。但这会引发错误：ERROR TypeError: Cannot read property 'keys' of undefined。

然后从互联网上得到了一个建议，所以我在组件中写了Object = Object并成功了。

1. 我不明白这背后的哲学是什么。
2. 花括号中的其他表达式和语句如何在Angular模板中工作？

Answer 1

模板表达式上下文通常仅限于组件实例本身。因此，当您在{{}}内插变量时，它实际上将寻找基础组件实例或模板引用变量的匹配属性。

在组件中执行Object = Object时，实际上是在创建该组件的属性Object，该属性引用该组件所引用的全局Object。

但是在模板表达式中不可能做到这一点，除了undefined之外，它对全局属性没有任何访问权限。

docs的这一部分对此进行了解释：

  

模板表达式不能引用全局名称空间中的任何内容，   除了未定义。他们不能引用窗口或文档。   此外，他们不能调用console.log（）或Math.max（），它们是   仅限引用表达式上下文的成员。

Answer 2

您在模板中呈现的所有内容都应该是组件的一部分，这确实有助于封装，有助于防止将来出现错误，意外行为并简化调试任务 另一方面，请避免使用{{}}内部的方法，因为它们起着不纯管道的作用，并且每次与DOM进行用户交互时都会运行几次，因此最好保存函数的结果，或component.ts中一个属性中的方法，而该属性就是您显示的那个