Question

这是方案

＆＃13;

angular.module('myApp', [])
.controller('bookCtrl', function($scope) {
    $scope.book = {
        name: 'Session Invites',
        friends: [
             {'id': 1, 'name': 'raju' },
            {'id': 2, 'name': 'radha' },
            {'id': 3, 'name': 'luttappi' },
            ]
    };
    $scope.update = function(){ 
        $scope.book.friends[1] = {'id': 2, 'name': 'sam' };
        alert($scope.book.friends[1].name );
    };
});

＆＃13;

<div ng-controller="bookCtrl">
    <input type="text" ng-model="book.friends[1].name"/>
    <input type="button" id="btn" name="btn" value="update" ng-click="update()"/>
</div>

＆＃13;

我想使用＆＃34; id＆＃34;而不是数组＆＃34;索引＆＃34;。 fiddle

<input type="text" ng-model="book.friends[1].name"/>

Answer 1

你可以这样做：

angular.module('myApp', [])
    .controller('bookCtrl', function ($scope) {
    $scope.book = {
        name: 'Session Invites',
        friends: [{
            'id': 1,
                'name': 'raju'
        }, {
            'id': 2,
                'name': 'radha'
        }, {
            'id': 3,
                'name': 'luttappi'
        }]
    };
    $scope.update = function (friend) {

        alert(friend.name);
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="bookCtrl">
    <div ng-repeat="friend in book.friends">
      <input type="text" ng-model="friend.name" />
      <input type="button" id="btn" name="btn" value="update" ng-click="update(friend)" />
    </div>
  </div>
</div>

Answer 2

有可能使用for loop，但我认为下面的这项工作可能对您有意义。

只需使用Object.proerty而不是数组来更改JSON的结构。它会做一些技巧。

angular.module('myApp', [])
.controller('bookCtrl', function($scope) {
    $scope.book = {
        name: 'Session Invites',
        friends: {
            id1: {'name': 'raju' },
            id2: {'name': 'radha' },
            id3: {'name': 'luttappi' },
        }
    };
    $scope.update = function(){ 
        $scope.book.friends.id1 = {'name': 'sam' };
        alert($scope.book.id1.name );
    };
});

注：的对此解决方法的担忧是提供JSON的API。如果数据recived结构固定，角度需要将JSON转换为此结构。您可能需要知道要转换的data有多大。因为这样的任务会导致Memory Leaked然后JavaScript Garbage Collection。它会显着减慢你的应用程序

Answer 3

您可以改用：

    angular.module('myApp', [])
    .controller('bookCtrl', function($scope) {
    $scope.GetOne={};
        $scope.book = {
            name: 'Session Invites',
            friends: [
                 {'id': 1, 'name': 'raju' },
                {'id': 2, 'name': 'radha' },
                {'id': 3, 'name': 'luttappi' },
                ]
        };
        $scope.update = function(){ 
            $scope.GetOne=$scope.book.friends[1];
            alert($scope.GetOne.name );
        };
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="bookCtrl">
      <input type="text" ng-model="GetOne.name" />
      <input type="button" id="btn" name="btn" value="update" ng-click="update()" />
    </div>
  </div>

如何从对象数组键绑定元素与ng-model

3 个答案: