Question

所以我对Angular有2天的问题，有没有办法在没有控制器的情况下对所有角度数据求和？

我想从所有subTotal打印totalPrice，我试图使用方法getTotalPrice（）在控制器中求和，但我不知道如何传递subTotal数组

@foreach($products as $product)
   <div class="form-group" ng-init="qty_{{$product->id}}=0">

     {{Form::label($product->id, $product->name.' - '.$product->price, array('class'=>'col-md-4 control-label'))}}
     <input type="hidden" ng-model="price_{{$product->id}}" ng-init="price_{{$product->id}}={{$product->price}}">

     <div class="col-md-2">
       <input id="{{$product->id}}" type="number" min="0" value="0" step="1" class="form-control" name="qty_{{$product->id}}" ng-model='qty_{{$product->id}}'>
     </div>

     <div class="col-md-6">
       <label for="" class="col-md-10 control-label"><% qty_{{$product->id}} * {{$product->price}} %></label>
     </div>

   </div>
   <br>
@endforeach

<div class="form-group">
   <div class="col-md-6 col-md-offset-6">
      <label for="" class="col-md-6 control-label">Total Price</label>
      <label for="" class="col-md-4 control-label" ng-model="totalPrice" ng-init="totalPrice = 0" ng-value="<% getTotalPrice() %>"><% getTotalPrice() %></label>
   </div>
 </div>

继承我当前的控制器

myApp.controller('cashierController', ['$scope', function($scope){
  $scope.subTotal = [];
  $scope.getTotalPrice = function(subTotal) {
    var totalPrice = 0;
    for(sub in subTotal){
      totalPrice += sub;
    }
    return totalPrice;
  }
}]);

P.S：我在laravel中使用棱角分明对不起，如果有任何奇怪的代码，请提前致谢。

Answer 1

一种方法是用php / laravel解决它：

在@foreach添加新变量之前

<?php $grandTotal = 0 ?>

并在totalPrice标签之前的foreach内

<?php grandTotal += $product->price  ?>

内部标签只是回应它：

<label>{{ $grandTotal }}</label>  <!--or normal echo-->

第二个选项 哪个更清洁，添加一个非常简单的路线返回产品作为JSON文件和$ http从角度获取它然后将它传递给您的视图，它将至少使事情更清楚（（您将使用角度来处理和安排FE视图无法通过刀片处理所有内容））。

Route::get('products/json','ProductsController@getAllJson');

inside ProductsController

public function getAllJson() {
//inject your repository above and use it here or simply use eloquent

return Product::all();

}

现在在你的控制器内角度只需简单的$ http get：

myApp.controller('cashierController', ['$scope,$http', function($scope,$http){

  $scope.products = [];
  $scope.grandTotal = 0;

  $http.get('products/json')
      .then(function(response){
    $scope.products = response.data;
       });

// there is no need for this function anymore since you've 2-way-binding
  $scope.getTotalPrice = function() {
    return totalPrice;
  }
}]);

最后，在您的HTML中使用angular ng-repeat和我们已声明为grandTotal的变量。

<div ng-repeat="product in products" class="form-group">

<!-- Other content goes here for each product -->

<label for="" class="col-md-10 control-label">
@{{grandTotal}}
</label>

</div>

在没有控制器的情况下将所有值加总

1 个答案: