Question

<body ng-controller="testeCtrl">
  <img src="http://adsim.co/wp-content/uploads/2015/11/adsim_logo_cores_2x.png" alt="#" class="logo">
  <div class="jumbotron barraPrincipal" ng-app="teste">
    <div class="table-responsive">
      <table class="table">
        <tr ng-repeat="i in getNumber(number) track by $index">
          <th>
            <select class="logo form-control" ng-model="refrigerante" ng-options="refrige as (refrige.nome+' '+refrige.quantidade) for refrige in refri">
              <option value="">
                <h4>Selecione o refrigerante</h4></option>
            </select>
          </th>
          <th>
            <input class="form-control" type="number" min="1" placeholder="Informe a quantidade" ng-model="quantidade"></input>
          </th>
          <th>
            <h4>Valor Unitário: {{refrigerante.preco | currency:'R$' }}</h4>
          </th>

          <th>
            <h4 ng-show="refrigerante != null && quantidade > 0 && quantidade != 0" ng-model="i.fields[$index].item_count" name="item_count">Valor dos produtos: {{va = quantidade*refrigerante.preco | currency:'R$'}} </h4></th>
        </tr>
        <tr>
          <td></td>
          <td></td>
          <td></td>
          <!-- total value of refrigerante.preco*quantidade here -->
          <td>Valor total <span> </span></td>
        </tr>
      </table>
    </div>
  </div>
  </div>
</body>

Answer 1

如果你想总结一些东西，ng-repeat可能没什么用。您可以在html中定义过滤器或在范围内调用函数，如下所示：{{calculateSum（）}}

https://docs.angularjs.org/api/ng/filter/filter

Answer 2

首先，您的HTML中存在大量语义错误，其中一个位于<input> 标记中。它是自动关闭标记，因此您无需关闭它。此外，您试图将总值设置为 ngRepeat ...

要实现您想要的效果，只需在控制器中创建function，如下所示：

$scope.total = function(refrigerante, quantidade) {
  return refrigerante.preco * quantidade;    
}

然后在视图中调用它：

<tr ng-repeat="i in getNumber(number) track by $index">
  ...
  <td ng-bind="'Valor total ' + total()"></td>
  <!-- Or -->
  <td>Valor total {{total()}}</td>
</tr>

计算ng-repeat angularjs中的动态和

2 个答案: