Question

我有一个包含三个输入的列表，用户可以通过按下位于其左侧的红叉来删除每个输入。当用户删除一个输入时，下一个输入被聚焦并且所选复选框被删除。直到那么好到目前为止。删除元素后，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>

Plunker：http://plnkr.co/edit/BRN9csBcxHp5QU96NKq9?p=info

Answer 1

啊，我看到了这个问题。 ng-repeat重新使用元素，并在初始链接期间选择索引。如果您在idx处理程序中设置keyup，则可以正常运行。 (PLNKR)

element.on('keyup', function () {
    idx = scope.$index;

AngularJS - ng重复。在ng-repeat重新渲染之后需要关注相同的元素事件

1 个答案: