AngularJS: особенности пробрасывания объектов в директиву

Table of Contents

Есть у меня директива такого плана:

<div my-selector initial-value="{a: 1}"></div>

1	<div my-selector initial-value="{a: 1}"></div>

Хотелось бы отслеживать изменения в директиве. Вот так она выглядит:

directive('fbFieldObjectSelector', ['$rootScope', function ($rootScope)
{
	return {
		restrict: 'A',
		scope: {
			initialValue: '='
		},
		template: 'div',
		link: function link($scope, $el, attrs)
		{
			...

directive('fbFieldObjectSelector', ['$rootScope', function ($rootScope)

{

return {

restrict: 'A',

scope: {

initialValue: '='

template: 'div',

link: function link($scope, $el, attrs)

{

...

Самый простой способ:

$scope.$watch('initialValue', function (initialValue) {
	// @debug                                             
	console.log(initialValue);                            
	$scope.selectProduct(initialValue);                   
});

$scope.$watch('initialValue', function (initialValue) {

// @debug

console.log(initialValue);

$scope.selectProduct(initialValue);

});

он не работает, ошибка
Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!

Второй способ:

$scope.$watch('initialValue', function (initialValue) {
	// @debug                                             
	console.log(initialValue);                            
	$scope.selectProduct(initialValue);                   
}, true);

$scope.$watch('initialValue', function (initialValue) {

// @debug

console.log(initialValue);

$scope.selectProduct(initialValue);

}, true);

и третий способ:

$scope.$watchCollection('initialValue', function (initialValue) {
	// @debug
	console.log(initialValue);
	$scope.selectProduct(initialValue);
});

$scope.$watchCollection('initialValue', function (initialValue) {

// @debug

console.log(initialValue);

$scope.selectProduct(initialValue);

});

работают, но тоже выдают ошибку:
Error: [$compile:nonassign] Expression '{a: 1}' used with directive 'fbFieldObjectSelector' is non-assignable!

Четвёртый способ, работающий:

attrs.$observe('initialValue', function (initialValue) {
	initialValue = $scope.$eval(initialValue);
	console.log(initialValue);
	$scope.selectProduct(initialValue);
});

attrs.$observe('initialValue', function (initialValue) {

initialValue = $scope.$eval(initialValue);

console.log(initialValue);

$scope.selectProduct(initialValue);

});

AngularJS: особенности пробрасывания объектов в директиву

Самый простой способ:

Второй способ:

и третий способ:

Четвёртый способ, работающий:

Similar Posts

LEAVE A COMMENT Отменить ответ