5

我很想知道为什么我总是要这样做

$scope.$watch( function() {
   return $scope.someData;
}, function( value ) {
   console.log( value );
});

对于 Angular 来实际观察数据，为什么我必须这样做，这是真正困扰我的事情之一，因为它看起来毫无意义。

如果我做这样的事情

$scope.$watch($scope.someData, function( value ) {
   console.log( value );
});

哪个更好，它永远不会起作用？

我也经常在工厂中使用它

说这$data是我必须做的工厂

$scope.$watch( function() {
   return $data.someData;
}, function( value ) {
   console.log( value );
});
4

4 回答 4

23

我想值得一提的$watch是，当你想监控一个条件时，传递一个函数很有用：

$scope.$watch(function() { 
    return $scope.data.length > 0; 
}, function() {
    // Do something every time $scope.data.length > 0 changes
});

或者

$scope.$watch(function() { 
    return $scope.prop1 && $scope.prop2;
}, function() {
    // Do something every time $scope.prop1 && $scope.prop2 changes
});
于 2013-08-13T17:51:51.970 回答
8

这有效：

$scope.$watch("someData", function( value ) {
   console.log( value );
});
于 2013-08-13T16:50:02.423 回答
3

使用工厂，您需要监视一个函数，因为如果您传递一个字符串，Angular 会将其评估为针对 $scope 的表达式。由于 $data.someData 未在您的 $scope 上定义，因此它不起作用。

要详细说明@Codezilla 的评论，您可以将您的工厂数据分配给某个 $scope 属性，然后观察：

$scope.data = $data.someData;
$scope.$watch('data', function(newValue) { ... });
于 2013-08-13T17:18:21.973 回答
1

由于已经给出了操作方法的答案，我将尝试向您解释实际发生的情况以及为什么它不像您第一次尝试的方式那样工作。

首先，这段代码确实有效，

$scope.$watch(function() {
   return $scope.someData;
}, function(value) {
   console.log(value);
});

但这不是完美的方式。更准确地说是在函数中$watch注入，像这样，scope

$scope.$watch(function(injectedScope) {
   return injectedScope.someData;
}, function(value) {
   console.log(value);
});

以前它之所以有效，是因为$scopeandinjectScope是一回事。

现在正如这篇文章所解释的，

由于$scope被传递到 watch 函数中，这意味着我们可以监视任何期望范围作为参数并返回值作为响应的函数。一个很好的例子就是$interpolate 函数。

因此，在您的情况下，我们还可以使用$interpolate以下方法：

$scope.$watch($interpolate("{{someData}}"), function(value) {
    ...
});

现在这是我们使用仅使用手表表达式的速记方法的地方。 $watch也可以接受一个表达式，实际上是interpolated。

因此通过提供$scope.$watch("someData", ... ),

someData将会：

  1. 内插为{{someData}}
  2. 使用$watch函数注入的作用域

这是编写表达式而不是实际函数的一种很好的、​​干净的、可读的、简写的方式。但最终在所有这些编译之后，最终是函数返回一个值来观察。

于 2014-10-15T16:21:44.087 回答