javascript - Angular2 - 在组件类中创建多个变量声明与直接在模板中使用对象

Question

我有一个从 http 请求中检索大型嵌套对象的组件。在我的组件类中，我声明了数百个从该对象推断数据的变量，然后将这些属性插入到其模板中。

这导致我的组件类仅来自声明和分配的那些属性就具有数百行代码。只在模板中使用对象本身会更好吗？下面是一个例子来演示：

假设我有一个非常大的嵌套美食对象，它来自服务。使用我当前的方法，在组件类中，我为我需要的各个属性声明变量：

let italianBreakfast = cuisine.data.breakfast.italian; let ... let ... let ...

然后在模板中插入：<div>{{italianBreakfast}}</div>

我修改后的策略是简单地使用模板中的对象：

<div>{{cuisine.data.breakfast.italian}}</div>

这样做时，我的模板中大括号之间的文本会变大，但我会从中受益，因为我不再声明属性来在我的组件类中存储对象值，这将节省数百行代码。哪个会更好，是否有最佳实践？

标签： javascriptangulartypescriptangular2-template

Answer 1

您可以在这个大组件内创建较小的组件，并将cuisines对象的特定部分作为@Input属性传递给它们。