Ng-галочка не обновляется после изменения данных
У меня есть следующая проблема с компонентом ng-checked: у меня есть список записей с проверенным свойством, которое передается в HTML-шаблон. Первоначально записи поставляются с проверкой на "ложь", но после обработки некоторых данных значение устанавливается в "истина". Несмотря на то, что я изменяю массив, и у меня есть контрольный набор для этой директивы, проверяемое значение не обновляется (установлено в false). Я не знаю, что мне не хватает. Шаблон:
<span data-ng-repeat="item in data_used track by $index" ng-class="class">
<input id="{{name_used}}_{{item.value}}"
type="checkbox"
name="{{name_used}}"
value="{{item.value}}"
data-ng-click="checkbox_click(item, $event)"
data-ng-checked="{{item.checked}}"
tabindex="0"/>
<label for="{{name_used}}_{{item.value}}"
data-ng-show="item.text">{{item.text}}
</label>
</span>
Контроллер:
$scope.$watch('data', function() {
var array = angular.fromJson($scope.data);
});
Массив передан в директиву:
$scope.useForAccountData = [
{
text: lang.get('nli_customer_data_debit_placeholder'),
value: 'debit',
backendValue: 'refund',
checked: false
},
{
text: lang.get('nli_customer_data_credit_placeholder'),
value: 'credit',
backendValue: 'withdrawal',
checked: false
}
];
Часть, где массив обновляется:
angular.forEach($scope.useForAccountData,function(el) {
if(bankAccount.usedFor && bankAccount.usedFor.indexOf(el.backendValue) >= 0) {
el.checked = true;
}
});
Вся директива:
'use strict';
define(['angular'], function(angular) {
return angular.module('portals.vio.checkboxGroup', [])
/* Directive */
.directive('vioCheckboxGroup', [
function() {
return {
restrict: 'AE',
scope: {
disabled: '@',
click: '&',
reset: '=?',
data: '@',
dataAddress: '@',
name: '@',
fieldsetLegend: '@',
dynamic: '@',
class: '@',
validationRules: '=',
validate: '='
},
controller: ['$scope','$http', 'lang', 'validationUtils', function($scope,$http,lang,validationUtils) {
if( $scope.validationRules &&
$scope.validationRules.helperMessage) {
//show the helper message
$scope.textShow = 'help';
$scope.validationText = $scope.validationRules.helperMessage;
}
$scope.itemsChecked = [];
$scope.itemsCheckedPositions = [];
if($scope.dataAddress) {
$http.get($scope.dataAddress).then(function(resp) {
$scope.data_used = angular.fromJson(resp.data);
}, function(err) {
$scope.data_used = angular.fromJson($scope.data);
});
}
else if($scope.data) {
$scope.data_used = angular.fromJson($scope.data);
}
$scope.name_used = ($scope.name) ? $scope.name: 'default';
/* Trigger the given callback everytime a checkbox is toggled */
$scope.checkbox_click = function(item, event) {
if(item.checked)
item.checked = false;
else
item.checked = true;
/* Create a list with all checked checkboxes */
angular.forEach($scope.data_used, function(val, key) {
if(val.checked){
$scope.itemsChecked.push(val);
$scope.itemsCheckedPositions.push(key);
}
});
var valid = $scope.validateCheckbox();
$scope.click({items: $scope.itemsChecked, valid: valid});
};
$scope.$watch('data', function() {
var array = angular.fromJson($scope.data);
});
/* Function triggered through the reset callback */
$scope.reset_fields = function() {
angular.forEach($scope.data_used, function(val, key) {
val.checked = false;
});
};
$scope.reset = function() {
$scope.reset_fields();
};
if( $scope.validationRules) {
$scope.validate = function(obj) {
if(obj === undefined) {
if(!$scope.valid) {
$scope.validateCheckbox();
}
}
else {
if( obj.type && obj.message) {
$scope.textShow = obj.type;
$scope.validationText = obj.message;
}
}
};
};
$scope.validateCheckbox = function() {
var checkboxIsValid = true;
if( $scope.validationRules &&
$scope.validationRules.hasChecked) {
try {
if($scope.itemsChecked.length !== $scope.validationRules.hasChecked ) {
$scope.textShow = 'error';
$scope.validationText = lang.get('errorSelectionNotMatchingSetNumber') + $scope.validationRules.hasChecked + lang.get('elements');
checkboxIsValid = false;
}
}
catch(ex) {
checkboxIsValid = false;
}
}
if( $scope.validationRules &&
$scope.validationRules.hasCheckedAtLeast) {
try {
if($scope.itemsChecked.length < $scope.validationRules.hasCheckedAtLeast) {
$scope.textShow = 'error';
$scope.validationText = lang.get('errorSelectionLowerThanExpected') + $scope.validationRules.hasCheckedAtLeast + lang.get('elements');
checkboxIsValid = false;
}
}
catch(ex) {
checkboxIsValid = false;
}
}
if( $scope.validationRules &&
$scope.validationRules.hasItemsChecked) {
try {
var counter = 0;
angular.forEach($scope.itemsCheckedPositions, function(val,key){
if($scope.itemsCheckedPositions.indexOf(val)<0){
counter++;
}
});
if(counter !== $scope.itemsCheckedPositions.length) {
$scope.textShow = 'error';
$scope.validationText = lang.get('errorSelectionDifferentThanPresetOnes');
checkboxIsValid = false;
}
}
catch(ex) {
checkboxIsValid = false;
}
}
if(checkboxIsValid) {
$scope.textShow = '';
$scope.validationText = '';
}
return checkboxIsValid;
};
validationUtils.registerValidationEvents($scope, $scope.validateCheckbox);
}],
replace: true,
templateUrl: '../../ui.components.base/vio-checkbox-group/vio-checkbox-group.html',
link: function($scope, elem, attrs) {
/* Update the fieldset legend with a name, if given */
$scope.$watch('fieldsetLegend', function(new_val, old_val) {
var legend_elem = elem.find('legend');
legend_elem.remove();
if(new_val !== undefined) {
elem.find('fieldset')
.prepend('<legend>' + new_val + '</legend>');
}
});
}
};
}]);
});
После обновления массива в части watch я вижу значения с флажком true, но в html свойство ng-checked все еще равно false.
Спасибо вио