javascript - 为什么 Angular 范围保持引用？

Question

JS

angular.module('bindExample', []).controller('ExampleController', ['$scope', function($scope) {
    $scope.gridFields = {
        id: {
            width: 50
        },
        price: {
            width: 60
        },
    };
    $scope.allData = {
        'one': {
            id: '1234qwe',
            price: 900
        },
        'two': {
            id: 'asdadw',
            price: 1700
        },
        'three': {
            id: '342sdaw',
            price: 1200
        },
    };
    $scope.edit = function(row) {
        console.log(row);
        $scope.buffer = $scope.allData[row];
    }
}]);

HTML

<div ng-app="bindExample">
   <div ng-controller="ExampleController">
      <table>
         <tbody>
            <tr ng-repeat="(row, data) in allData">
               <td ng-repeat="(field, option) in gridFields" ng-bind="data[field]"></td>
               <td><button ng-click="edit(row)">edit</button></td>
            </tr>
         </tbody>
      </table>
      <div>
         <input type='text' ng-model="buffer.id"/>
      </div>
      <div>
         <input type='text' ng-model="buffer.price"/>
      </div>
   </div>
</div>

单击编辑后，值从 $scope.allData 转到 $scope.buffer 变量，并且输入使用缓冲区作为模型，但是当输入更改时，allData 变量中的值也会更改，但我不这样做想要这个，这就是为什么尝试将值传递给其他...

此处说明的问题:JSFIDDLE

有什么想法吗？

Answer 1

使用angular.copy()

    $scope.buffer = angular.copy($scope.allData[row]);