当前位置: 代码迷 >> JavaScript >> AngularJS-从服务访问控制器内部的元素
  详细解决方案

AngularJS-从服务访问控制器内部的元素

热度:137   发布时间:2023-06-13 11:38:15.0

我有一个带有两个控制器的应用程序,我想更改一个控制器以影响存储在另一个控制器中的(不同的)数据。 tl; dr当我从第一个控制器中删除类别时,我想编辑第二个控制器中具有该类别的所有项目,以使它们现在变为无类别的。

据我所知,我想要使用的是服务,但是我觉得如果有一种方法可以简单地在控制器作用域内编辑数据,那会更简单。 所以我的问题是:

  1. 有没有一种方法可以简单地从服务中编辑控制器数据或调用控制器方法?

  2. 否则,即使前一个控制器只需要访问更改数据,将后一个控制器的数据存储在服务中是否合理? 我如何参考这些数据以进行ng-repeats?

编辑:澄清数据是一组json对象,其中包含每个类别和每个项目的数据,并且网页包含ng-repeats来遍历并列出每个对象。 我有许多功能可编辑两个数据列表,并且我希望更改一个列表以在另一个列表中进行更改。

您的想法是正确的,您应该将所有业务逻辑(包括需要在应用程序的不同部分之间保持一致的数据)放入services controller仅应管理视图并将数据连接到该视图。

请记住, service是 -每个service始终只有一个实例来保存您的数据。

回答您的问题:我认为在service中将数据存储在service而不是controller中总是合理的(也就是当数据不是特定于多个视图之一,而是在整个当前应用程序状态下保持一致),并提供访问权限对该数据进行操作就可以了-更好的方法是将操作逻辑放入服务本身(或仅用于该服务的另一个服务)中,并让controller连接到调用该操作的调用。

Todd Motto有关于该主题的 (瘦控制器)

我认为最好将事件用于此目的。 在您的第一个控制器中,您可以按以下方式发布有关类别删除的事件。

  $scope.deleteCategory = function (category) {
    $rootScope.$broadcast("categoryDeleted", category); 
 }

然后,您可以在任何控制器中观察此事件,例如下面的第二个控制器,您可以侦听categoryDe??leted事件。

$scope.$on("categoryDeleted", function (event, category) {
                   // do whatever you want
                });

不要直接从服务中调用控制器,这是一个坏习惯,不仅在AngularJS中,而且在大多数语言框架中。

您所描述的问题(“更改一个控制器以影响(不同的)另一个控制器中存储的数据”)是组件之间的通信问题。 您可以通过事件解决此问题,因此无需将数据从第二个控制器移至服务。

让我们考虑一些示例: :

当您单击LOG按钮时,将调用this.broadcastItem(),并广播“ handleBroadcast”事件。 其他控制者controllerOne和controllerTwo处理此事件:

$scope.$on('handleBroadcast'

并做他们想做的事情。

因此,在这种情况下,您可以引入'categoryRemoved'事件,并在第一个控制器中广播此事件。 广播事件后,您的第二个控制器将对其进行处理并编辑其项目。 另外,您应该在事件中传递已删除的类别(而不是示例中的“ msg”),以便第二个控制器必须知道确切地删除了哪个类别。

可以使用$ rootScope(在控制器之间共享-在一个控制器中进行修改,在另一个控制器中进行访问)来实现此目的,但这通常是个坏主意。 我不确定我是否正确,但是在您实际需要控制某些外部数据的服务时它是典型的情况。您要修改某些静态json吗? 您可以更清楚地指定它吗? :)