Question

我正在进行广播和收听广播时我试图更新我想要在视图上显示的范围的变量，但这些更改没有立即反映在视图中，直到我点击UI。任何人都知道此时应该做什么，我不想使用$ apply。在这里，请找到我的代码。

rApp.factory('pService', ['$http', '$rootScope', '$sanitize', 

function ($http, $rootScope, $sanitize) {

 var pService = {};

 //Some other code

 pService.Update=function(status)
 {
   if(status.LastItemId!=undefined)
   {
     pService.disItemId = status.LastItemId;
     $rootScope.$broadcast('updated',pService.disItemId);    
   }
 }

 //Some other code

return pService;

});


rApp.controller('dController', ['$scope','$rootScope' 'pService' ,dController]);

function dController($scope,$rootScope, pService) {

$rootScope.$on('updated',function (event, data) {
            $scope.lastItemId = data; // I want to display the lastItemId on UI
    })
});

Answer 1

是什么触发了正在发送的事件，即您的服务的update()方法在何处被调用？如果从外部角度调用摘要循环，则可能需要使用apply来触发摘要循环。我从评论中看到你正在使用SignalR，它不会创建一个摘要周期来更新角度的绑定。尝试使用以下方式打包您的电话：

$rootScope.$apply(function(scope) {
    service.Update();
});

您也不需要使用$rootScope.on()，只需使用$scope.on()。根范围上的广播将归结为所有子范围。如果该消息未在其他地方使用，您可以使用$rootScope.emit()向上冒泡但不会在所有子范围内向下消息。

Answer 2

理想情况下，服务用于在不同的控制器中共享通用方法。返回this很好。此外，如果您需要将值返回到控制器，而不是使用事件，为什么不简单地从服务公共方法返回值并访问控制器中的值。此外，控制器的工作是启动或调用服务方法并更新相应的范围。从服务到通知控制器的触发事件类似于firing events from one controller to other。服务不是为此目的而制作的。请参阅我的代码以供参考。

DEMO - http://plnkr.co/edit/Co7ka0sZKZgYk5Oz88Np?p=preview

<强> JS ：

var app = angular.module('myApp', []);
app.controller('myController', ['$scope', '$rootScope', 'pService', function ($scope, $rootScope, pService) {
  $scope.name = 'softvar';
  $scope.itemId = pService.Update({LastItemId: 4})

}]);

app.factory('pService', [ '$rootScope', function ( $rootScope) {

 this.pService = {};

 //Some other code

 this.Update= function(status) {
   if (status.LastItemId) {
     this.pService.disItemId = status.LastItemId;
     console.log(this.pService.disItemId)
     return this.pService.disItemId;    
   }
 }

  //Some other code
  return this;

}]);

<强> HTML ：

<body ng-app="myApp" ng-controller="myController">
    <h1>ItemId is:  {{itemId}}!</h1>
</body>

UPDATE：

DEMO - http://plnkr.co/edit/Co7ka0sZKZgYk5Oz88Np?p=preview

<强> JS ：

var app = angular.module('myApp', []);
app.controller('myController', ['$scope', '$rootScope', 'pService', function ($scope, $rootScope, pService) {
  $scope.name = 'softvar';

  $scope.$on('serviceUpdated', function (ev, data) {
    $scope.itemId = data;
  });

  pService.Update({LastItemId: 4});

}]);

app.factory('pService', [ '$rootScope', function ( $rootScope) {

 this.pService = {};

 //Some other code

 this.Update= function(status) {
   if (status.LastItemId) {
     this.pService.disItemId = status.LastItemId;
     console.log(this.pService.disItemId)
     $rootScope.$broadcast('serviceUpdated', this.pService.disItemId);   
   }
 }

  //Some other code
  return this;

}]);

$ scope。$未在视图中反映的更改

2 个答案:

UPDATE：