使用服务在控制器之间共享数据

Question

我有一个简单的问题：当两个控制器之间进行交互时，应该采用什么样的最佳（“最干净”，“可扩展”）路径。那是定义服务并观察服务的返回值以便做出反应吗？

我设置了一个简单的示例here，我在其中查看服务的当前值：

$scope.$watch(
    function() {
        return myService.getValue();
    },
    function(newVal) {
        $scope.value1 = newVal;
    });

并在单击其中一个按钮时更新该服务的值。

这可以做得更好，更小，更干净吗？这里最好的做法是什么？

干杯。

Answer 1

使用服务在控制器之间共享数据

你的情况是试图在控制器之间共享数据，而不是在控制器中监视服务的价值，我认为直接引用服务对象到控制器的范围是更好的方法

所以你的观点可以是

 <pre ng-controller="cntrl1">Value in cntrl1: {{ myService.value }} <button ng-click="update('value1')">Change to 'value1'</button></pre>

  <pre ng-controller="cntrl2">Value in cntrl2: {{ myService.value }} <button ng-click="update('value2')">Change to 'value2'</button></pre>

并将您的控制器更改为

app.controller('cntrl1', function(myService, $scope) {
  $scope.myService = myService;
  $scope.update = function(str) {
    $scope.myService.setValue(str);
  }
});

app.controller('cntrl2', function(myService, $scope) {
  $scope.myService = myService;
  $scope.update = function(str) {
    $scope.myService.setValue(str);
  }
});

使用$ broadcast / $ emit

正如@squiroid指出的那样，您可以使用$broadcast向监控目标事件的任何控制器广播事件。

请注意，最好不要使用$rootScope.$broadcast + $scope.$on，而是$rootScope.$emit+ $rootScope.$on因为$broadcast事件会在所有后代范围内向下泄漏，这可能会导致严重的性能问题。

Answer 2

这是与控制器通过服务共享相同数据进行通信的最佳方式，但是有限的黑白控制器具有相同的服务： -

相反，您也可以选择广播由其他控制器捕获的事件，并相应地更改该数据，这种方式更具可扩展性但不干净： - ）

Sender ctrl :-
$rootScope.$broadcast('update', 'Some data'); //method that lets pretty much everything hear it even $scope too.

或

$rootScope.$emit('update', 'Some data');// only lets other $rootScope listeners catch it

听取Ctrl： -

   $rootScope.$on('update', function (event, data) {
        console.log(data); // 'Some data'
      });

在AngularJs中的控制器之间进行通信

2 个答案:

使用服务在控制器之间共享数据

使用$ broadcast / $ emit