使用 ng-repeat | 搜索后将 "checked" 值保留在输入复选框中Angularjs

Question

我必须让用户 select 稍后提交它们，但是当 select 多个项目然后搜索另一个项目以 select 它们时，我的问题就出现了，之前的 selected 项恢复为默认值 未选中。

如何在再次调用 getAllItems 函数后将选中的值保留到 selected 项目？因为发生的事情是 ng-repeat 清除了先前 selected 项的值。

我的看法：

<div id="dialog-items">
         // the search box
        <input ng-change="getAllItemNames(searchValMultiItems)" ng-model="searchValMultiItems" type="text"/>

        <table>
            <th>Designation</th>
            <th>Colisage</th>
            <th>Code</th>
            //the mark() function is to set checked value to selected input and store the item in an array
            <tr ng-repeat="d in allDesignation" ng-click="markItem(d.itemName); ischeck=true;">
                <td ><input type="checkbox" ng-checked="ischeck" /> {{d.itemName}}</td>
                <td>{{d.item_colisage}}</td>
                <td>{{d.code}}</td>
            </tr>
        </table>
</div>

JS:

//calling this function to search for an item
 $scope.getAllItemNames=function(searchValMultiItems){

    var searchItems=searchValMultiItems;

    var url="../php/mainPageFacture.php";
    var data = {"function":"getAllItemNames","searchValMultiItems":searchItems};

    var options={
        type : "get",
        url : url,
        data: data,
        dataType: 'json',
        async : false,
        cache : false,
        success : function(response,status) {
            $scope.allDesignation=response;
            $scope.safeApply(function() {});

        },
        error:function(request,response,error){
            alert("Error");
        }
    };
    $.ajax(options);
}

 /*this is responsible to set checked value to true when 
   item is selected and store all selected item in an array*/
 $scope.markItem=function(itemName){

    if( $.inArray(itemNameWithCode, multiSelectItem_names) !== -1 ) {
       alert("This Item is already added to this Invoice");
    }else{
        multiSelectItem_names.push(itemNameWithCode);
    }
}

我将所有 selected 项目存储在一个数组中，即使在搜索数组后仍保留该值，但问题仅在于选中标记，我将附上一张照片以作进一步说明

Answer 1

将选中的属性设为列表中项目的一部分。

<tr ng-repeat="d in allDesignation" ng-click="markItem(d.itemName); d.ischeck=!d.ischeck;">
            <td ><input type="checkbox" ng-checked="d.ischeck" /> {{d.itemName}}</td>
            <td>{{d.item_colisage}}</td>
            <td>{{d.code}}</td>
        </tr>

这需要对您的实现进行一些更改。

一个选项是将列表项存储在 $scope 中。

$http.get('dataurl')
.then(function(response) {
    $scope.items = response.data;
});

您可以使用过滤器来过滤 ng-repeat 中的项目。

<tr ng-repeat="d in items | filter:{ property: filterText }">...</tr>

看这里ng-repeat :filter by single field

使用 ng-repeat | 搜索后将 "checked" 值保留在输入复选框中Angularjs

keeping the "checked" value to an input checkbox after search using ng-repeat | Angularjs

javascript

checkbox

angularjs

angularjs-ng-repeat