以角度将html绑定到多个.ts文件答案

【问题标题】：Bind html to multiple .ts file in angular以角度将html绑定到多个.ts文件
【发布时间】：2020-10-08 08:22:39
【问题描述】：

我目前正在开发一个 Angular 应用程序，特别是在样式和功能方面非常复杂的表格。

我的组件文件目前有 2k 行代码，它包含用于设置文本样式、设置表格样式、检查数据处理是否正确、数据格式化等功能... 许多这些函数都是通过插值直接从 HTML 字段调用的。

有什么办法可以将这个相当大的文件分解成更小的文件？

【问题讨论】：

【解决方案1】：

您可以将组件分解成更小的组件并嵌套它们。

典型示例：

<app-list>
  <app-list-item></app-list-item>
</app-list>

然后父组件可以将其属性向下传递给子组件：

<app-list>
  <app-list-item [name]="valueFromParent"></app-list-item>
</app-list>

还可以将值从子级返回到父级：

<app-list>
  <app-list-item (onChildEvent)="updateParent($event)"></app-list-item>
</app-list>

我试图在这里保持简单，但还有更多。我建议通过官方Angular tutorials，因为他们很好地解释了这些概念。

您应该进一步尝试在Services 中添加尽可能多的功能。这也有助于使您的组件更小、更易于推理并有助于测试。

例如functions for check if data treated are correct 是服务方法的一个很好的例子。

【讨论】：