添加更改金额并更改Ionic复选框中的总计

拉莫斯

我在Checkbox中创建了一个列表,列出了用户可以选择产品的产品。我需要在产品列表中添加一个选项,用户可以在其中更改所选产品的数量。我该怎么办?

我的看法:

<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>      

我的控制器:

    $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);
});
杰耶什

您可以有一个带有+和-按钮的输入框。单击哪个用户可以更改所选产品的数量。

如果您可以分享更多详细信息,也许我可以用更好的方式回答。

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

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

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

更改CGridView中的ID复选框

来自分类Dev

更改boostrap中复选框的大小

来自分类Dev

复选框中的JQuery / JavaScript更改

来自分类Dev

在CGridView中更改ID复选框

来自分类Dev

更改boostrap中复选框的大小

来自分类Dev

侦听复选框更改

来自分类Dev

复选框的位置更改

来自分类Dev

检测复选框更改

来自分类Dev

更改复选框状态

来自分类Dev

复选框更改状态

来自分类Dev

GridBagLayout:添加复选框后更改对齐方式

来自分类Dev

在输入类型编号更改时添加复选框

来自分类Dev

选中复选框时添加类并更改内部 HTML

来自分类Dev

当AngularJs中的复选框更改时,向div中添加和删除类

来自分类Dev

在复选框的更改事件中添加和删除数组内的值

来自分类Dev

单击复选框后,React应用程序中的复选框未更改状态

来自分类Dev

复选框:通过Ajax更改复选框的状态

来自分类Dev

选中复选框时更改复选框颜色?

来自分类Dev

选中复选框时更改复选框颜色?

来自分类Dev

根据AngularJS中的多个条件更改复选框状态

来自分类Dev

如何在Android中更改复选框刻度颜色

来自分类Dev

根据屏幕尺寸更改Bootstrap中的复选框标签

来自分类Dev

在setmultichoiceitems中更改标准复选框的颜色

来自分类Dev

在Materialize框架中更改复选框的颜色

来自分类Dev

更改组中的复选框表单控件

来自分类Dev

在ANTD复选框中更改刻度颜色

来自分类Dev

如何在SQLform中更改复选框标签的位置

来自分类Dev

防止用户更改TreeView中的复选框

来自分类Dev

更改iText中复选框字段的外观