Tag Archives: watch

AngularJS: как следить за изменением значения произвольных функций

Иногда бывает нужно следить за значением, возвращаемым из функции, не привязанной к $scope (т.е. не являющейся его методом). Допустим, есть некая сложная функция:

function getParams()
{
	if (! map) {
		return false;
	}
	var center = map.getCenter(),
		size = map.getSize(),
		markersList = exportMarkers();

	return {
		zoom: map.getZoom(),
		lat: roundCoord(center.lat),
		lng: roundCoord(center.lng),
		minZoom: 3,
		maxZoom: 18,
		mapWidth: size.x,
		mapHeight: size.y,
		markers: markersList
	};
}

function getParams()

{

if (! map) {

return false;

}

var center = map.getCenter(),

size = map.getSize(),

markersList = exportMarkers();

return {

zoom: map.getZoom(),

lat: roundCoord(center.lat),

lng: roundCoord(center.lng),

minZoom: 3,

maxZoom: 18,

mapWidth: size.x,

mapHeight: size.y,

markers: markersList

};

}

Для того, чтобы отслеживать её изменения, нужно сделать так:

var scope = $rootScope.$new(true);
scope.$watch(function (scope) { return getParams();}, function () {
	// do anything. for instance:
	// $rootScope.$broadcast('params_changed');
}, true);

var scope = $rootScope.$new(true);

scope.$watch(function (scope) { return getParams();}, function () {

// do anything. for instance:

// $rootScope.$broadcast('params_changed');

}, true);

Продолжить чтение: http://www.bennadel.com/blog/2658-using-scope-watch-to-watch-functions-in-angularjs.htm

AngularJS: $watch за объектами

Чтобы не вызывалась лишний раз функция, нужно добавить еще один параметр true в $watch:

$rootScope.$watch('session', function (value) {
	$scope.profile = ProfileDataService.get();
}, true);

$rootScope.$watch('session', function (value) {

$scope.profile = ProfileDataService.get();

}, true);

Но он иногда запускает обработчик, поэтому можно сделать внутри дополнительную проверку:

$rootScope.$watch('session', function (value, valueOld) {
	if (! angular.equals(value, valueOld)) {
		$scope.profile = ProfileDataService.get();
	}
});

$rootScope.$watch('session', function (value, valueOld) {

if (! angular.equals(value, valueOld)) {

$scope.profile = ProfileDataService.get();

}

});

AngularJS: почему не надо назначать обработчики на $rootScope внутри контроллеров

Вот здесь — https://blog.bullgare.com/2013/09/angularjs-%D0%BE%D1%82%D0%B2%D1%8F%D0%B7%D1%8B%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BE%D0%B1%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D1%87%D0%B8%D0%BA%D0%BE%D0%B2-%D0%B8-%D1%80%D0%B0%D1%81%D1%81%D1%83%D0%B6%D0%B4/ подробно описано, как сложно всё выходит, если внутри контроллера повесить обработчик на события в $rootScope. Вкратце — потому, что при смене маршрута обработчик события никуда не девается, и его приходится руками удалять. Простое решение проблемы — вешать обработчики не на $rootScope, а на локальный $scope, который потом удалится вместе со всеми …

AngularJS: отвязывание обработчиков и рассуждение об опасностях использования вложенных контроллеров

В нашем приложении (чего уж тут скрывать — http://m.mamba.ru, тач-версия) всё построено на встроенных в angular маршрутах. При этом, как известно, шаблон страницы отрисовывается внутри тега ng-view. Появилось несколько страниц, на которых внутри контента (это важно) нужно показывать баннер.

Object.watch

Возможность наблюдать за изменениями свойств объекта. Описание — https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/watch#Examples, http://dailyjs.com/2012/11/12/code-review-watch-js/. Object.watch-polyfill — https://gist.github.com/384583. Известная в узких кругах библиотека для отслеживания изменений свойств объекта — https://github.com/melanke/Watch.JS.