平均堆栈：通过AngularJS计算并显示值的总和

嗨，我是一个初学者，拥有平均堆栈，目前正面临一个逻辑挑战

我知道如何用HTML中的{element.length}获取表中元素的计数，但我需要获取给定值的总和

提前谢谢你的帮助

HTML:

控制器：

angular.module('drinkController', [])

    // inject the drink service factory into our controller
    .controller('mainController', ['$scope','$http','Drinks', function($scope, $http, Drinks) {
        $scope.formData = {};
        $scope.loading = true;

        // GET =====================================================================
        // when landing on the page, get all drinks and show them
        // use the service to get all the drinks
        Drinks.get()
            .success(function(data) {
                $scope.drinks = data;
                $scope.loading = false;
            });

        // CREATE ==================================================================
        // when submitting the add form, send the text to the node API
        $scope.createDrink = function() {

            // validate the formData to make sure that something is there
            // if form is empty, nothing will happen
            if ($scope.formData.text != undefined) {
                $scope.loading = true;

                // call the create function from our service (returns a promise object)
                Drinks.create($scope.formData)

                    // if successful creation, call our get function to get all the new drinks
                    .success(function(data) {
                        $scope.loading = false;
                        $scope.formData = {}; // clear the form so our user is ready to enter another
                        $scope.drinks = data; // assign our new list of drinks
                    });
            }
        }


//Problem Function!! I don't know how to read desired values
$scope.getTotal=function(){

    var total=0;
    for (var i=0; i <$scope.drinks; i++){
        var sum= $scope.drinks.volume[i]; //??
        total= sum ; //?

    }
    return total;
}



        // DELETE ==================================================================
        // delete a todo after checking it
        $scope.deleteDrink = function(id) {
            $scope.loading = true;

            Drinks.delete(id)
                // if successful creation, call our get function to get all the new todos
                .success(function(data) {
                    $scope.loading = false;
                    $scope.drinks = data; // assign our new list of todos
                });
        };
    }]);

在我的HTML中，我需要显示所有卷条目的值，因此它应该是3。

这应该可以：

$scope.getTotal=function(){

var total=0;
for (var i=0; i <$scope.drinks.length; i++){
    total += $scope.drinks[i].volume;
}
return total;
}

---

谢谢你的代码！不幸的是，结果总是0:/在for循环i<$scope.drinks.length而不是i<$scope.drinks中进行此更改

angular.module('drinkController', [])

    // inject the drink service factory into our controller
    .controller('mainController', ['$scope','$http','Drinks', function($scope, $http, Drinks) {
        $scope.formData = {};
        $scope.loading = true;

        // GET =====================================================================
        // when landing on the page, get all drinks and show them
        // use the service to get all the drinks
        Drinks.get()
            .success(function(data) {
                $scope.drinks = data;
                $scope.loading = false;
            });

        // CREATE ==================================================================
        // when submitting the add form, send the text to the node API
        $scope.createDrink = function() {

            // validate the formData to make sure that something is there
            // if form is empty, nothing will happen
            if ($scope.formData.text != undefined) {
                $scope.loading = true;

                // call the create function from our service (returns a promise object)
                Drinks.create($scope.formData)

                    // if successful creation, call our get function to get all the new drinks
                    .success(function(data) {
                        $scope.loading = false;
                        $scope.formData = {}; // clear the form so our user is ready to enter another
                        $scope.drinks = data; // assign our new list of drinks
                    });
            }
        }


//Problem Function!! I don't know how to read desired values
$scope.getTotal=function(){

    var total=0;
    for (var i=0; i <$scope.drinks; i++){
        var sum= $scope.drinks.volume[i]; //??
        total= sum ; //?

    }
    return total;
}



        // DELETE ==================================================================
        // delete a todo after checking it
        $scope.deleteDrink = function(id) {
            $scope.loading = true;

            Drinks.delete(id)
                // if successful creation, call our get function to get all the new todos
                .success(function(data) {
                    $scope.loading = false;
                    $scope.drinks = data; // assign our new list of todos
                });
        };
    }]);

    [{"_id":"555c23943e0bf3fc403864c3",
"comment":"Yummie",
"__v":0,
"time":"2015-05-20T06:03:17.340Z",
"**volume":2**,
"text":"Coke"},
{"_id":"555c239d3e0bf3fc403864c4",
"comment":"Mooh!",
"__v":0,
"time":"2015-05-20T06:03:17.340Z",
**"volume"**:1,
"text":"Milk"}
]

$scope.getTotal=function(){

var total=0;
for (var i=0; i <$scope.drinks.length; i++){
    total += $scope.drinks[i].volume;
}
return total;
}