Updating value in ng-repeat based on dropdown

Question

I'm building a table using ng-repeat to display some information. One of the columns displayed is a 'Weight' column. We store all the weight in kilograms in the database, but need to give the user an option to display the weight in pounds.

I have a dropdown where the user is able to select the weight unit, and on ng-change i'm trying to update the table. However, i'm having trouble getting it to work.

Here is a look at my change function (full example in JSFiddle):

 $scope.ConvertWeights = function () {
        if ($scope.schedWeight.ID == "I") {
            $scope.items.Weight = $scope.items.Weight * 2.2046;
        } else {
            $scope.items.Weight = $scope.items.Weight / 2.2046;
        }

    }

Here is a JSFiddle of what I'm currently attempting. If anyone has ran into a similar situation, I'd appreciate any advice on how to get this working! Thanks!

score 1 · Accepted Answer · answered Sep 15 '14 at 12:38

Please update your function

$scope.ConvertWeights = function () {
    if ($scope.schedWeight.ID == "I") {
        angular.forEach($scope.items, function(item){
            item.Weight = item.Weight * 2.2046;
        })
    } else {
        angular.forEach($scope.items, function(item){
            item.Weight = item.Weight / 2.2046;
        })
    }
};

score 0 · Answer 2 · answered Sep 15 '14 at 12:36

$scope.items is your item collection (an array). You were probably trying to write:

$scope.ConvertWeights = function () {
    if ($scope.schedWeight.ID == "I") {
        for (var i in $scope.items)
            $scope.items[i].Weight = $scope.items[i].Weight * 2.2046;
    } else {
        for (var i in $scope.items)
            $scope.items[i].Weight = $scope.items[i].Weight / 2.2046;
    }
}

You need to modify the Weight property on each element, not on the collection itself.

Updating value in ng-repeat based on dropdown

2 Answers2