Question

我是Angularjs的新人，有一个问题。我从后端加载我的数据，需要计算总数。就像我们看到的那样，我有06个条目[0,0,0,0,0.1,0.1]，总数将是0.20。但如果用户更改价格，我需要重新计算，但不会这样做。请有人告诉我如何更新？

Answer 1

请找到以下更新的工作解决方案!!!

var app = angular.module('example', []);

app.controller('exampleCtrl', function ($scope) {
    $scope.test = [
      {
          "Name": "Initiative",
          "Price": 0.1,
          "Prices": [0.0, 0.1, -0.1]   //For my Dropdowliste
      },
      {
          "Name": "Believe",
          "Price": 0.1,
          "Prices": [0.0, 0.1, -0.1]   //For my Dropdowliste
      },
      {
          "Name": "Tendance",
          "Price": 0.1,
          "Prices": [0.0, 0.1, -0.1]   //For my Dropdowliste
      },
      {
          "Name": "Reach",
          "Price": 0.1,
          "Prices": [0.0, 0.1, -0.1]  //For my Dropdowliste
      },
        {
            "Name": "Head",
            "Price": 0.1,
            "Prices": [0.0, 0.1, -0.1]   //For my Dropdowliste
        }
    ];


    function getTotalResult() {

        var runningSalesTotal = 0.0;

        angular.forEach($scope.test, function (data) {
            runningSalesTotal += parseFloat(data.Price);
        });

        return runningSalesTotal;
    }

    $scope.mySum = function () {        
        $scope.result = getTotalResult();
    }

    $scope.mySum();

});

<!DOCTYPE html>
<html ng-app="example">
<head>
    <link rel="stylesheet" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
    <script src="script.js"></script>
</head>
<body ng-controller="exampleCtrl">
    <h1>Hello Plunker!</h1>
    <div class="row">
        <div class="col-md-12">
            <div class="table">
                <table class="table table-bordered table-striped table-hover">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Personalnummer</th>
                            <th>Price</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="eigens in test" ng-click="eineFunktion(eigens)">
                            <td>
                                {{eigens.Name}}
                            </td>
                            <td>
                                <span data-ng-hide="editMode">{{eigens.price}}</span>
                            </td>
                            <td>
                                <select ng-model="eigens.Price" ng-change="mySum()"
                                        ng-options="value for value in eigens.Prices"></select>
                            </td>
                        </tr>
                        <tr>
                            <td>Summe</td>
                            <td></td>
                            <td>{{result | currency: '€'}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</body>
</html>

Angularjs表总计与下拉更改

1 个答案: