如何减少角度5中的代码行数

Question

我们的angular 5应用程序文件在不断增长，因为我们的应用程序是具有动态组件的SPA。我们将布局用作主要组件，并在主要组件上渲染其他组件。因此，大多数逻辑都落在主要组件上，主要组件集中在1460行左右。我们已经将实用程序方法移至实用程序，但仍有1460行。

在这里分享您的想法。

Answer 1

在A是您的主要组成部分的情况下，您正在这样做：

A-> B

因此，组件B中所有回调处理程序的逻辑都在组件A中，使A陷入困境（显然，C，D，E等的回调逻辑也位于A中）。

您应该这样做：

A-> B-> C

在此，C负责C的主要逻辑，而B则处理回调事件。 A保持清洁。

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

这是Angular中公认的模式，但新开发人员会忽略它。这种模式可确保关注点分离。

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

ngrx：https://github.com/ngrx/platform（有关Udemy的精彩教程）

基于主题的服务：https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service（不限于父子）

本文可能会有所帮助：https://blog.angulartraining.com/component-architecture-with-angular-6f7bc9165443?__s=nrn5hrwjji1wznrbpids

另外，值得一提的是，存在组件的原因有2个：

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

（2）重复使用

在这里，您需要关注（1）并更好地模块化您的应用程序。