Question

我在我的网络应用中使用factory。在factory中有一个对象mapLayers。在我的controller我将此factory.mapLayers对象分配给范围$scope.mapLayers上的变量，并且我在其上使用ngRepeat。

问题是factory.mapLayers中发生的更改不会影响$scope.mapLayers，因此DOM不会显示新的更改。我如何$watch或将$factory.mapLayers绑定到factory.mapLayers？

mapService.js：

...
factory.mapLayers = [];
...
return factory;

mainController.js：

...
$scope.mapLayers = MapService.mapLayers;
...

main.html中：

...
<div ng-repeat="layer in mapLayers">
    ...
</div>

Answer 1

您必须在变量上注册观察者。把它放到你的控制器中：

$scope.$watchCollection(
    function () {
        return MapService.mapLayers;
    }, function (newVal, oldVal, scope) {
        // the `scope` parameter refers to the current scope
        scope.mapLayers = MapService.mapLayers 
    }
)

$watchCollection()的第一个参数是一个返回要监视的值的函数（也可以是一个被评估为Angular表达式的字符串），第二个参数是在检测到更改时调用的回调函数

值得一提的是，$watch()可能不起作用（取决于您如何更改数组），因为它只会检查数组引用是否已更改 - 后者发生，例如，如果您将MapService.mapLayers分配给新的Array对象。

另一方面，

$watchCollection还将监视阵列的内容中的更改，即它将检测添加或删除项目等更改。有关更详细的解释，您可能还希望看到Ben Nadel对两者之间的差异有很大的了解blog post。

Answer 2

您应该在控制器中$watch服务变量。

mainController.js：

$scope.$watch(function() { return MapService.mapLayers },function() {
    $scope.mapLayers = MapService.mapLayers 
})

如何$在工厂中观察一个字段angularJS

2 个答案: