我有一个包含三个输入的列表,用户可以通过按下放置在它们左侧的红十字来删除每个输入。当用户删除一个输入时,将聚焦下一个输入并删除选中的复选框。直到那里到目前为止这么好。删除元素后,ng-repeat 循环遍历更新的模型,我失去了元素焦点。有什么办法可以防止这种情况发生吗?
非常感谢,
吉列尔莫
PD:包括指令代码以防万一。
directive('checkEmptyInput', function ($timeout,$q) {
return {
restrict: 'A',
require: '?ngModel',
link: function (scope, element, attrs, ngModel) {
if(!ngModel) return; //do nothing if no ng-model
var idx = scope.$index,
array = [],
fieldIsValid = false;
element.on('keyup', function () {
switch (attrs.checkEmptyInput) {
case "method":
array = scope.album.tracks;
fieldIsValid = scope.ngAlbumForm.track.$valid;
break;
}
if(array[idx].name && array[idx].name != "" && fieldIsValid) {
array[idx].active = true;
} else {
array[idx].active = false;
if(scope.elementHasId(array[idx])){
scope.deleteKeyFromCombinationsCodes(array[idx].id);
}
};
if (array[idx].name == "") {
//Previous to delete focus the next element
$timeout(function () {
var nextElem = element.parent().next().find('input')[0];
if(nextElem !== undefined) {
if(!scope.$last) {
//Delete the element
console.log("Deleting from inside the directive...");
nextElem.focus();
scope.$emit("deleteArrayElement", [idx]);
}
}
});
}
});
}
}
})
HTML:
<div ng-repeat="track in album.tracks">
<input check-empty-input="track" type="text" ng-change="addInputText($index,$last,track.name,album.tracks;" ng-minlength="3" class="album_tracks" ng-model="track.name" ng-unique="track"/><button type="button"/>
<i class="remove-icon"></i>
</button>
</div>