2016-08-09 173 views
0

Ich habe eine Liste in Checkbox erstellt, in der Produkte aufgelistet sind, in denen der Benutzer ein Produkt auswählen kann. Ich brauche hinzufügen in der Produktliste eine Option, wo der Benutzer die Menge der ausgewählten Produkte ändern kann. Wie kann ich es tun?Änderungsbetrag hinzufügen und Gesamtwert in Kontrollkästchen in Ionic ändern

Meine Ansicht:

<ion-view view-title="Bebidas Adicionais" ng-controller="exBebidasCtrl" >  

<div class="bar bar-subheader"> 
     <h2 class="title">{{'Sub-Total R$ ' + getTotalSelected()}}</h2> 
</div> 

 <ion-refresher pulling-text="Puxe para atualizar..." on-refresh="doRefresh()"></ion-refresher> 
     <ion-list class="card list"> 
      <div class="item item-input"> 
       <i class="icon ion-search placeholder-icon"></i> 
       <input type="search" ng-model="q" placeholder="Procurar" aria-label="filter bebidasextras" /> 
      </div> 
     </ion-list> 

    <ion-list> 

     <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> 
</ion-list>  

      <button class="button button-block button-balanced"> 
       <a ng-click="addToCart(bebida.ad_bebida_titulo,bebida.ad_bebida_valor)" class="button button-assertive button-clear icon ion-android-cart"> Continuar Comprando </a> 
      </button>  
    </ion-content>  

Mein Controller:

$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; 
      }; 

     $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; 
    } 

}) 
.error(function(erro) {   
    console.log(erro); 
}); 

Antwort

1

Sie können ein Eingabefeld ein + mit haben und - Taste. Durch Klicken auf den Benutzer kann die Menge des ausgewählten Produkts geändert werden.

Wenn Sie weitere Details teilen können, wäre ich wahrscheinlich in der Lage, besser zu antworten.

+0

Ja, ist so, ich brauche. Aber ich kann das nicht in der Checkbox tun. – Ramos

+1

Sie können es rechtsbündig mit + und - Tasten mit Auswahl (Kontrollkästchen) auf der linken Seite ausrichten lassen. Ich denke, so handhaben die meisten mobilen Apps die Produktanzahl. – Jayesh

+0

Ich habe meine Meinung geändert, ich denke, das ist dann besser: http://StackOverflow.com/Questions/38860396/How-Create-an-input-Box-having-a-and-Button-in-Ionic – Ramos