在Angular应用程序中实现一致的组件行为

Question

人们使用什么技术来实现Angular组件在应用程序中应具有的行为的一致性？特别是对于非常大的项目或地理位置分散的团队？像：

• 所有组件都应设置页面标题
• 所有顶级组件都应该对页面刷新具有弹性
• 所有组件应确保他们取消订阅ngOnDestroy()上的内容

是否值得将其中的一些内容放入抽象基础组件中？注入Title和ActivateRoute以及订阅跟踪器的东西，并为ngOnInit()和ngOnDestroy()提供基本实现，并强制子类实现title(): string和subscriptions(): any[]等方法？

这对作曲来说更好吗？如果是这样，您如何强制由分布式工程师团队编写的组件注入（并适当使用）TitleService，或RefreshManager或SubscriptionTracker？

是否足以在团队中宣传公约？定义所有顶级组件必须遵循的代码结构标准？如果是这样，这些是如何执行的？

装饰器似乎可以用来解决一些问题空间。创建一个装饰器，如：

@PageTitle("Foo Title")
@Component({...})
export class FooComponent {
}

这是一个函数支持ngOnInit()与代码存储现有标题并设置“Foo标题”，然后包装noOnDestroy()以恢复原始标题的代码。但是装饰器的限制似乎排除了注入服务，上面的例子仍然需要FooComponent实现OnInit, OnDestroy，以便装饰器在构建时正确应用。

总结一下：人们目前如何解决这个问题？

1. 所有常见功能的抽象基础组件
2. 注入每个组件的几个常用实用程序
3. 编码标准，用于跨组件强制执行一致（重复）代码
4. 还有别的

Answer 1

谢谢@Jeff的问题。这是一个有趣的话题。这是我的两分钱。我相信别人还有更多话要说。

1. 所有常见功能的抽象基础组件

我使用角度1的事件和角度5的可观察事件。

title: Subject<boolean>

基本上，您有一个使用title可观察的公共服务构建。您的其他团队可以订阅此常用服务。此服务提供更新页面标题的方法，并在标题更改时通知其他人。

2. 注入每个组件的几个常用实用程序

如果您有许多服务/组件，则可以将它们捆绑为模块，然后您和您的其他团队成员可以将此模块作为第三方模块之一导入。

import { MyCommonModule }      from 'my-common-module';

此捆绑包没有路由，但可以包含任何可视组件或非可视服务。

3. 编码标准，用于跨组件强制执行一致的代码

如果所有常见模块都位于上面的MyCommonModule中，那么您不需要过多关注一致性，因为没有多少人触摸该repo / module

4. 还有别的

编码模块可能与编写应用程序不同，因此您可能需要拥有自己的构建系统，以便可以在本地测试它以及推送到npm进行分发。