Как оценивать поле на фабрике angularJS

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 на новый массив объект.

$watchCollection, с другой стороны, будет также следить за изменениями в содержание массива, т.е. он будет обнаруживать изменения, как добавление или удаление элементов. Для более подробного объяснения вам также может понадобиться посмотреть, как Бен Надель замечательно оценивает различия между ними.

Answer 2

Вы должны $watch переменную службы в контроллере.

mainController.js:

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