在 Angularjs 中更新模型

Question

这是 plnkr : http://plnkr.co/edit/s9MwSbiZkbwBcPlHWMAq?p=preview

如果我两次添加信息，最新的数据是一样的，如何防止模型更新？

 $scope.personList = [];
  $scope.newPerson = {};
  $scope.columns = [{ field: 'Name' }, { field: 'Country' }];
  $scope.gridOptions = {
    enableSorting: true,
    columnDefs: $scope.columns,
    onRegisterApi: function(gridApi) {
      $scope.gridApi = gridApi;
    }
  };

  $scope.addPerson = function(){

  $scope.personList.push($scope.newPerson);

}

  $http.get('file.json')
    .success(function(data) {
      $scope.personList = data.records; 
      $scope.gridOptions.data = data.records;
      console.log($scope.gridOptions.data);
    });

Answer 1

使用 angular.copy() 创建一个副本，这样您就不会每次都将对同一对象的引用推送到数组中。

$scope.addPerson = function(){
  var newPerson= angular.copy($scope.newPerson);
  $scope.newPerson ={}; // reset to clear view
  $scope.personList.push(newPerson);    
}

Answer 2

我想这就是你想要做的。

Updated Plnkr

JS 的变化

$scope.addPerson = function(){

    $scope.personList.push(angular.copy($scope.newPerson)); //optional to use angular.copy()
    $scope.newPerson={}; //reset the object rather than one field
  }

Answer 3

你需要做的是，在推入列表之前，你需要检查列表中的项目的索引。如果索引 > -1 则推送。

$scope.addPerson = function(){

  if($scope.personList.indexOf($scope.newPerson > -1){
    $scope.personList.push($scope.newPerson);
  }
}

Answer 4

这是一个 plunker solution:

您应该添加此功能：

$scope.containsObject= function(obj, list) {
var i;
for (i = 0; i < list.length; i++) {
    if (list[i] === obj) {
        return true;
    }
}

return false;

}

将在内部调用

  $scope.addPerson = function(){

if (!$scope.containsObject($scope.newPerson, $scope.personList)) {

  $scope.personList.push($scope.newPerson);
 $scope.newPerson.Name = '';
 }
}

在 Angularjs 中更新模型

Updating Model in Angularjs

angularjs

angular-ui-grid