如何减少angular 5中的代码行数

我们的angular 5应用程序文件不断增长，因为我们的应用程序是一个带有动态组件的SPA。我们使用布局作为主组件，并在主组件上渲染其他组件。因此，大部分逻辑都落在主组件上，main component.ts占据了大约1460行。我们已经将实用程序方法移动到实用程序，但仍然有1460行

---

在这里分享您的想法。

如果A是您的主要组件，您可以这样做：

A-->B

因此，组件B中回调处理程序的所有逻辑都在组件A中，为组件A弄乱了局面（显然，C、D、E等的回调逻辑也在A中）

您应该这样做：

A-->B-->C

这里，C负责C所做的一切的主逻辑，B处理回调事件。A保持清洁

（您可以一起开发B和C，或者C可以是可重用的或库组件）

这是一个公认的模式，但被新开发人员忽略了。这种模式确保了关注点的分离

组件间通信通常通过全局存储解决方案（如ngrx）或基于主题的服务实现（尽管@Input@Output模式有时也很有用）

ngrx：（Udemy上的精彩教程）

基于主题的服务：（不限于亲子）

这篇文章可能会有帮助：

此外，值得一提的是，组件的存在有两个原因之一：

（1） 代码组织-减少父组件的代码量/复杂性

（2） 再利用

---

在这里，您需要将重点放在（1）上，并更好地管理您的应用程序。

为什么1400行是一个问题？但除此之外，如果你把所有事情都放在主界面上，你的应用程序似乎缺少一些结构。检查一些angular admin项目结构，了解angular应用程序的流程应该是怎样的，并相应地更改你的应用程序。你的应用程序应该分成不同的模块和小组件。