如何计算Ionic Framework中的“选定字段”复选框？

debugcn 发表于 Dev

拉莫斯

我创建了一个CheckBoxlist来从api获取数据，其中包括：

在控制器中：

$scope.bebidasextras = [];

var promise = $http.get('http://nhac.esy.es/api_carrinho/lista_bebida_extra.php?json=restaurantes')
  .success(function(retorno) {
    console.log(retorno);
    $scope.bebidasextras = retorno; // não precisa fazer retorno.data

        $scope.user = {
            bebidasextras: [$scope.bebidasextras[1]]
          };
          $scope.checkAll = function() {
            $scope.user.bebidasextras = angular.copy($scope.bebidasextras);
          };
          $scope.uncheckAll = function() {
            $scope.user.bebidasextras = [];
          };
          $scope.checkFirst = function() {
            $scope.user.bebidasextras = [];
            $scope.user.bebidasextras.push($scope.bebidasextras[0]);
          };
          $scope.setToNull = function() {
            $scope.user.bebidasextras = null;
          };

在视图中：

<ion-view view-title="Compra de Bebidas Adicionais" ng-controller="adbebidaCtrl" >

        <ion-checkbox ng-model="user.bebidasextra" > <h2>{{role.ad_bebida_titulo}}</h2> <p>R$ {{role.ad_bebida_valor}}</p></ion-checkbox>


    </ion-item>
</ion-list>

</ion-content>

如何计算选定的项目，当您完成选择列表后，单击一个按钮并将所有数据存储在本地，以备后用？

tpsilva

有个小提琴可以解决您的问题。

<div ng-repeat="bebida in bebidasextras">
  <ion-checkbox ng-model="bebida.selected" > 
      <h2>{{bebida.ad_bebida_titulo}}</h2>     
      <p>R$ {{bebida.ad_bebida_valor}}</p>
  </ion-checkbox>
</div>
<h2>{{'Total R$ ' + getTotalSelected()}}</h2>

$scope.getTotalSelected = function() {
  var total = 0;

  for(var i = 0; i < $scope.bebidasextras.length; i++){
    var bebida = $scope.bebidasextras[i];
    total += bebida.selected ? Number(bebida.ad_bebida_valor) : 0;
  }

  return total;
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。