Question

我尝试将对象数组绑定到html。但是当我改变输入值时，模型没有改变。我做错了什么？

抱歉，这是一个非常简单的案例，但我很困惑。

我的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>

我的代码：

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/

Answer 1

使用ng-model

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

演示：Fiddle

ng-value不用于2路绑定，它用于select / input-radio元素

Answer 2

您需要使用ng-model="prices[$index].price"

而不是ng-value="prices[$index].price"

Demo

ng-repeat不绑定ng-model对象数组

2 个答案: