解耦Angular模块

Decouple Angular modules

本文关键字：模块 Angular 解耦      更新时间：2023-09-26

我有一个用AngularJS制作的搜索web应用程序，其中包括两个angular模块:search-keyword-input模块和search-action模块。

第一个search-keyword-input模块具有建议功能、表单验证功能等。search-action模块的功能是请求数据并在表中显示可排序的结果。所以每个模块都有自己的控制器和指令。

问题来了:我模块化的原因是，我希望模块可以被重用和解耦。但是在这个应用程序中，search-keyword-input模块中的关键字模型值必须传递给搜索操作模块(search-action模块必须知道使用什么关键字来执行搜索)。那么我如何在模块之间传递值呢?它们如何在不耦合的情况下进行通信?

我已经找到了一种方法，如添加父控制器和全局$scope值:

<div ng-controller="globalController">
    <div ng-controller="keywordController"></div>
    <div ng-controller="searchController"></div>
</div>

因此，search-keyword模块可以在globalController的$scope上设置关键字值，search-action控制器也可以从globalController上获取该关键字值。但我认为这使得模块化变得毫无意义，因为它们是耦合在一起的。我还能做什么?

最好的办法是创建一个可以被两个控制器共享，并且可以单独使用的自定义服务，而不是污染父作用域。

相关文章：