如何从数据库中检查 ion-checkbox

Question

我已经填充了这个离子标签并且所有项目都未选中：

            <ion-checkbox ng-repeat="categoria in listaCategorias"
                           ng-model="categoria.checked"
                           ng-checked="categoria.checked"
                           ng-change="recuperarServicos(categoria)">
                           {{ categoria.nmCategoria }}
            </ion-checkbox>

这里是我的控制器代码，其中包含“类别 ID”列表：

//here I have the ids recovered from database that I split into an array of ids
var idsCategoria = $scope.meuanuncio.idsCategoria.trim().split(',');

if($scope.listaCategorias.length > 0)
{
    //for each item in my listaCategorias (used in ng-repeat)
    for (var i = 0; i < $scope.listaCategorias.length; i++) {

        var item = $scope.listaCategorias[i];

        //I compare id from each item with my list recovered from database
        if(idsCategoria.indexOf($scope.listaCategorias[i].idCategoria) != -1)
        {
            //If the item id exist in database list, I check the item
            item.checked = true;

            // Below there are other ways that I tried to use
            // $scope.listaCategorias[i].Selected = true;
            // $scope.listaCategorias[i].checked = true;
            $scope.listaCategorias[0].checked = true;
        }
    }
};

但我无法检查我的 ion-checkbox 项目。

我做错了什么？

谢谢。

Answer 1

ng-model="categoria.checked"

看起来不错，但认为您不需要 ng-checked。

 var item = $scope.listaCategorias[i];
item.checked = true;

不，该项目在循环中丢失了。我看到你在尝试：

$scope.listaCategorias[i].checked = true;

您是否遇到错误或其他问题？因为这看起来像这样做的方法。

也许尝试在 ion-checkbox 周围的 div 上循环？又名

<div ng-repeat="categoria in listaCategorias">
   <ion-checkbox ng-model="categoria.checked"
                 ng-change="recuperarServicos(categoria)">
                 {{ categoria.nmCategoria }}
   </ion-checkbox> 
</div>

Answer 2

试试这个：

<div ng-repeat="categoria in listaCategorias track by $index">
      <ion-item class="item item-checkbox">
           <label class="checkbox">
              <input type="checkbox" ng-model="categoria.checked" ng-change="recuperarServicos(categoria)">
           </label>
         {{categoria.nmCategoria}}
      </ion-item>
</div>

控制器：

$scope.recuperarServicos = function(categoria){
        if(categoria.selected && ($scope.selectedItems.indexOf(categoria.name) < 0)){
          $scope.selectedItems.push(categoria.name);
        }else{
            $scope.selectedItems.splice($scope.selectedItems.indexOf(categoria.name), 1);
        }
    };

希望这对您有所帮助..以某种方式..！

Answer 3

我的问题是当我将我的项目数组归因于 $scope.listaCategorias 时。

我正在这样做：

$scope.listaCategorias = listaCategorias;

但我需要这样做：

$scope.listaCategorias.push.apply($scope.listaCategorias, listaCategorias);

我正在构建一个内部包含已选中属性的数组，但是当我关联我构建的列表时，我正在关联第一个未设置已选中属性的数组。

现在让我展示我的代码。

我的看法：

        <div ng-repeat="item in listaCategorias track by $index">
              <ion-item class="item item-checkbox">
                   <label class="checkbox">
                      <input type="checkbox" ng-model="item.checked" ng-checked="item.checked" ng-change="recuperarServicos(item)">
                   </label>
                  {{ item.nmCategoria }}
              </ion-item>
        </div> 

我的控制器：

//here I get all my 'categorias' from datatable
listaCategorias = appFactory.recuperarCategorias();

//If list is not null go ahead   
if(listaCategorias != null) {

    //split into an array all my 'categoria' ids
    var idsCategoria = $scope.meuanuncio.idsCategoria.split(',');

    //if list has items go ahead
    if(listaCategorias.length > 0) {

        for (var i = 0; i < listaCategorias.length; i++) {

            //if 'categoria' id exists in datatable list set true, else false
            if(idsCategoria.indexOf(listaCategorias[i].idCategoria) != -1) {
                listaCategorias[i].checked = true;
            }
            else {
                listaCategorias[i].checked = false;
            }
        }
    };

    //Here is the point !!! I need to load my $scope variable this way to build all my items correctly
    $scope.listaCategorias.push.apply($scope.listaCategorias, listaCategorias);

}