为什么必须在Component中写Object=Object才能在Angular中获取Object.keys?
在我的 Angular 模板中,我需要一个对象的键数。我在模板文件中写入
{{ Object.keys(myObj).length }>
。但它会抛出一个错误:
ERROR TypeError:无法读取未定义的属性“keys”
。
然后我从互联网上得到了一个建议,所以我在我的组件中写入
Object = Object
,它起作用了。
- 我不明白这背后的哲学是什么。
- 花括号中的其他表达式和语句如何在 Angular 模板中工作?
模板表达式上下文通常仅限于组件实例本身。因此,当您在
{{}
内插入变量时,它本质上会查找底层组件实例或模板引用变量的匹配属性。
当您在组件中执行
Object = Object
时,实际上是在创建组件的属性
Object
,该属性引用组件引用的全局
Object
。
但在模板表达式中不可能实现相同的功能,它无法访问除
undefined
之外的任何全局属性。
文档 的这一部分对此进行了解释:
Template expressions cannot refer to anything in the global namespace, except undefined. They can't refer to window or document. Additionally, they can't call console.log() or Math.max() and they are restricted to referencing members of the expression context.
您在模板中呈现的所有内容都应是组件的一部分,这确实有助于封装,有助于防止将来出现错误和意外行为,并使调试任务更加容易 另一方面,稍微偏离主题一点,避免在 {{}} 内使用方法,因为它们充当不纯管道,并在每次用户与 DOM 交互时运行几次,最好将函数或方法的结果保存在 component.ts 中的属性中,并且该属性就是您要显示的属性