Angularjs watch service object

13 浏览
0 Comments

Angularjs watch service object

为什么我无法在服务中观察一个对象。\n我已经成功观察一个简单的变量,但是一个对象却无法工作。\nhttp://plnkr.co/edit/S4b2g3baS7dwQt3t8XEK?p=preview\nvar app = angular.module(\'plunker\', []);\napp.service(\'test\', [\'$http\', \'$rootScope\',\n function ($http, $rootScope) {\n var data = 0;\n var obj = {\n \"data\": 0\n };\n this.add = function(){\n obj.data += 1;\n console.log(\'data:\', obj);\n };\n this.getData = function() { return obj; };\n}]);\napp.controller(\'TestController\', [\'$scope\', \'$rootScope\', \'$filter\', \'test\',\n function($scope, $rootScope, $filter, test) {\n //test controller\n $scope.add = function(){\n test.add();\n };\n $scope.test = test;\n $scope.$watch(\'test.getData()\', function(newVal){\n console.log(\'data changes into: \', newVal)\n });\n}]);

0
0 Comments

AngularJS中的$watch服务对象的问题是出现在没有正确设置$watch函数的参数时,导致只进行了引用相等性的检查,而没有使用angular.equals进行相等性检查。

解决这个问题的方法是在$watch函数的最后一个参数中传入true,以便使用angular.equals进行相等性检查。

代码示例:

$scope.$watch('test.getData()', function(newVal){
  console.log('data changes into: ', newVal)
}, true);

在上述代码中,通过将true作为$watch函数的最后一个参数传入,确保了使用angular.equals进行相等性检查。

在这个问题的解答中提到了一个坏的实践,即在$scope中引用一个服务。实际上,并不需要在$scope中引用服务,因为$watch函数也接受一个getter函数作为第一个参数。通过使用这个函数直接返回要监视的数组,可以得到一个更干净的解决方案。

代码示例:

$scope.$watch(function() { return test.getData(); } ...

通过以上代码,可以使用一个匿名函数作为$watch函数的第一个参数,并在该函数中直接返回要监视的数组。

另外,为了解决引用相等性检查的问题,还可以使用$watchCollection来实现。$watchCollection函数可以解决引用相等性检查的问题。

完整解决方案如下:

代码示例:

$scope.$watchCollection('test.getData()', function(newVal){
  console.log('data changes into: ', newVal)
});

通过以上代码,可以使用$watchCollection函数来进行监视,并解决引用相等性检查的问题。

0
0 Comments

AngularJS中的$scope.$watch()函数可以用于监视变量或函数的变化。然而,将整个服务(service)注入到$scope中并不是一个好的做法。更好的方法是监视一个返回值的函数。

具体而言,下面的代码是一种更好的方式来使用$scope.$watch()函数:

$scope.$watch(function() { 
    return test.getData(); 
}, function(newVal) { 
    /* 执行相关代码 */
}, true);

这种方式适用于监视一个返回值的函数。其中,test.getData()是一个返回值的函数,可以根据业务需求自行替换。在函数返回值发生变化时,第二个回调函数将被触发,可以在其中执行相关操作。

需要注意的是,上述方式也适用于监视一个数组(如test.data)的变化。这是因为数组也可以通过返回一个函数的方式来监视。

使用$scope.$watch()函数时,注入整个服务到$scope中并不是一个好的做法。相反,我们应该监视一个返回值的函数,以确保代码的可维护性和可扩展性。

0