флажок снят галочкой после применения фильтра углового фильтра

Question

Это приводит к тому, что тот же элемент добавляется в массив - который используется для запроса - потенциально дважды. Когда модально закрывается и открывается снова, и фильтрация не используется, все в порядке (это потому, что мои модальности просто в HTML, я просто скрываю их при нажатии). Когда элемент, который уже был добавлен, но его галочка потеряна из-за фильтрации, проверяется снова, добавляются два одинаковых элемента. Если он не установлен, оба будут удалены, если это не последний элемент в массиве, это невозможно удалить (я знаю, что это моя логика slapdash). Ниже приведен код HTML и JavaScript (известные слова).

HTML:

<div style="display: inline-block;" ng-controller="modalCtrl"> 
       <button ng-click="showModal = !showModal">Entities</button> 
       <div ng-init="showModal=false"> 
        <div class="modal fade in" aria-hidden="false" 
         style="display: block;" ng-show="showModal"> 
         <div class="modal-dialog"> 
          <div class="modal-content"> 
           <strong>ENTITIES</strong> 
           <div> 
            <div> 
             <input type="text" placeholder="Search" ng-model="simpleFilter"> 
             <button type="button" ng-click="showModal=false">Ok</button> 
            </div> 
           </div> 
           <br> 
           <div ng-repeat="entity in entityArray | filter:simpleFilter"> 

            <label> <input 
             style="display: inline-block; margin-top: 5px" 
             type="checkbox" ng-model="entityChecked" 
             ng-change="getEntityFromModal(entity, entityChecked)" /> <a>{{entity}}</a> 
            </label> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 

модальный контроллер:

angular.module("app").controller("modalCtrl", ["$scope", "shareDataService", "getDataService", function ($scope, shareDataService,  ngDialog, getDataService) { 


$scope.entityArray = shareDataService.getEntityArray(); 
$scope.depotArray = shareDataService.getDepotArray(); 

    $scope.getEntityFromModal = function (entity, checked) { 
     shareDataService.setModalEntity(entity, checked); 
    }; 

    $scope.getDepotFromModal = function (depot, checked) { 
     shareDataService.setModalDepot(depot, checked); 
    }; 

}]); 

shareDataService (соответствующие методы):

angular.module("app").factory("shareDataService", function() { 

var entityArrayService = []; 
var depotArrayService = []; 
var modalEntity = []; 
var modalDepot = []; 

getEntityArray: function() { 
     return entityArrayService; 
    }, 
getDepotArray: function() { 
     return depotArrayService; 
    }, 
setModalEntity: function (entity, checked) { 
     if (!checked) { 
      for (var i = 0; i < modalEntity.length; i++) { 
       if (modalEntity[i] === entity) { 
        modalEntity.splice(i, 1); 
       } 
      } 
     } else { 
      modalEntity.push(entity); 
     } 
    }, 
setModalDepot: function (depot, checked) { 
     if (!checked) { 
      for (var i = 0; i < modalDepot.length; i++) { 
       if (modalDepot[i] === depot) { 
        modalDepot.splice(i, 1); 
       } 
      } 
     } else { 
      modalDepot.push(depot); 
     } 
    }, 
}); 

Есть и другие случаи, когда методы DATASERVICE называются в моем главном контроллере , но они используются только для длины массива. Поэтому, если проблема с флажком решена, все решено.

Answer 1

Наконец есть ответ - массив, затаив значения entityArray нужно изменить в массив хранения значений в формате JSON, и для каждого значения val должно быть значение checked, которое представлено ng-model - в выше дело будет передано в getEntityFromModal(entity, entity.checked).

работает plnk - https://plnkr.co/edit/2ptIAdOyaIw8mGqpU7Cp?p=preview

Answer 2

entityChecked не объявлен нигде в вашем javascript, поэтому каждый раз, когда вы фильтруете, entityChecked сбрасывается, поэтому вам нужно сделать модель той, что репитер увидит и получит доступ.

  <!-- entity is now in the created child scope --> 
<div ng-repeat="entity in entityArray | filter:simpleFilter"> 
    <label> <input style="display: inline-block; margin-top: 5px" 

     <!-- set the checked value on the 'entity' itself, then it will be retained --> 
     type="checkbox" ng-model="entity.entityChecked" 

     ng-change="getEntityFromModal(entity, entityChecked)" /> <a>{{entity}}</a> 
    </label> 
</div>