John Right
John Right

Reputation: 13

ng-repeat not bind ng-model array of objects

I'm try to bind array of objects to html. But when I changed input value, model not changed. What i'm doing wrong?

Sorry, this is very simple case, but i'm confused.

My html:

 <div ng-app="myApp" ng-controller="myCtrl">
            <table class="price-table">
                <tbody>
                <tr ng-repeat="item in prices track by $index">
                    <td><span>{{item.country_code}}</span></td>
                    <td><input ng-value="prices[$index].price" ng-input="item.price = item.price" ng-disabled="!item.editMode" type="text"/></td>
                    <td><button class="btn price-table-btn" ng-click="item.editMode = !item.editMode" ng-disabled="item.noEdit">&#9998;</button></td>
                    <td><button class="btn price-table-btn" ng-click="savePrice($index, item)" ng-disabled="!item.editMode">&#10003;</button></td>
                    <td><button class="btn price-table-btn" ng-click="removePrice($index, item)" ng-disabled="!item.editMode">&times;</button></td>
                </tr>
                </tbody>
            </table>
     <div>
            {{prices}}
        </div>
        </div>

My code:

angular.module('myApp', []);

angular.module('myApp')
.controller('myCtrl', function($scope) {
    $scope.prices = [{"country_code":"00","price":"12.00","editMode":false,"noEdit":false},{"country_code":"01","price":"1.00","editMode":false,"noEdit":false},{"country_code":"AU","price":"8.00","editMode":false,"noEdit":false},{"country_code":"CA","price":"5.00","editMode":false,"noEdit":false},{"country_code":"GB","price":"10.00","editMode":false,"noEdit":false},{"country_code":"UK","price":"10.00","editMode":false,"noEdit":false},{"country_code":"US","price":"3.00","editMode":false,"noEdit":false}];
});

http://jsfiddle.net/jaxxreal/ntb5b79w/

Upvotes: 1

Views: 1966

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388336

use ng-model

<input ng-model="item.price" ng-disabled="!item.editMode" type="text"/>

Demo: Fiddle

ng-value is not used for 2 way binding, it is used for select/input-radio elements

Upvotes: 1

painotpi
painotpi

Reputation: 6996

You need to use, ng-model="prices[$index].price"

instead of, ng-value="prices[$index].price"

Demo

Upvotes: 0

Related Questions