Question

我对这个问题感到非常愚蠢，因为我不能在plunker中重现这个问题，但它确实发生在我的真实项目中。

我创建了这个plunker here，我正在尝试查看范围变量searchString，它在这个plunker中运行正常，但在我的实际项目中没有。 $ scope.searchString保持为空。但是，html工作正常。可能的原因是什么？

我正在使用微风角度，当我尝试它时，如果我将searchString附加到实体对象，那么，它可以工作。为什么呢？

Answer 1

使用基元（字符串，布尔值，数字等）时，您无法引用它。当您使用对象或数组时，您可以引用和修改它的成员。

这意味着，当你做一个

$scope.$watch('searchString', function(str, oldValue) {
  console.log(str.length);
});

您正在检查searchString的新长度，首次调用$watch时可能为空/未定义/为空，oldValue将包含当前值。因此，如果您要从另一个范围或指令修改searchString，它将不会受到影响，因为新范围searchString是正在更改的范围（即当前实例值）。为了在定义它的地方有效地进行更改，您应该使用：

$scope.search = {input: ''};

$scope.$watch('search.input', function(str, oldValue) {
  console.log(str.length);
});

http://plnkr.co/edit/EFdnhQE1nN5vsBJR1sEm?p=preview

当$watch周期完成后，将会调用scope.$watch：$digest的简短说明。如果您从非角度事件（如jQuery上的element.on('click' ...)）外部更改数据（基元甚至对象），则必须调用$scope.$apply()或$timeout以在UI上反映它。否则，从ng-click或从输入更改为模型，您的$digest会自动调用，从而实时更新所有内容。有关$ scope和inheritance的一些信息https://stackoverflow.com/a/15645354/647380

Angularjs：$ scope.variable与视图不同步？

1 个答案: