如何在不创建新实例的情况下在多个地方使用同一个控制器？ AngularJS答案

【问题标题】：How can I use the same controller in multiple places without creating new instances of it? AngularJS如何在不创建新实例的情况下在多个地方使用同一个控制器？ AngularJS
【发布时间】：2019-05-10 16:17:05
【问题描述】：

我实际上是在尝试创建可在 WordPress 页面编辑器中使用的 html 组件块。我遇到的问题是每个块都使用 ng-controller 指令来访问所述控制器的范围。这会导致创建同一控制器的新实例，从而导致块出现延迟（这也不是一种实用的方法）。

我当前设置应用程序的方式是使用链接到一大页 html 的短代码，作为最终用户不容易管理，并且远离我想要实现的基于组件的结构.我尝试过使用 angularjs .component() 指令，但我遇到了同样的问题，即拥有新的控制器实例。

<div ng-controller="someCtrl"> 
--- first html block that loads first ---
</div>

<div ng-controller="someCtrl"> 
--- second html block that is delayed until after the first is loaded ---
</div>

基本上，我想知道是否有一种方法可以访问同一个控制器（不包括包装器）而不创建所述控制器的新实例？

【问题讨论】：

你试过用服务代替控制器吗？docs.angularjs.org/guide/services

标签： angularjs angularjs-controller

【解决方案1】：

答案是否定的。控制器的每个实例都是一个新实例。您可以利用 @TheUnknown 的建议在这些实例之间共享数据，因为服务是单例的。

【讨论】：

每个控制器确实是一个新实例，这就是我试图摆脱它的原因。服务似乎是最好的选择，因为我可以为每个组件使用不同的控制器。然后，这将导致页面上的性能更好，以及更“同步”的加载类型。

【解决方案2】：

您可以通过使用 ng-if 来使用相同的控制器。所以当

<div ng-if="loadFirstHtmlBlock"></div>

是真的。它只会加载那个特定的<div>。

同样适用

<div ng-if="loadSecondHtmlBlock">

这只是您可以使用的一种简单方法。

【讨论】：

这样做只会在块中添加条件，这会导致异步加载，也就是延迟加载。不幸的是，这与我正在寻找的相反。我希望每个组件/块同步加载。

【解决方案3】：

我发现作为解决此类问题的最佳方法（在 angularjs 中）的最终结果是添加不同的组件以及它们各自的控制器，这些控制器从服务中获取信息。然后，这将导致页面上的性能更好，以及更“同步”的加载类型。

【讨论】：