臨時ng模型？

Question

我有一個顯示SQL數據的表。我試圖只允許用戶編輯一行中的條目，如果該值已經存在於該列中的某處。

例如，如果我想在列更改值「Strawberry」「Fruit」到「Grape」，當我點擊了文本字段，它應該只保留價值「Grape」，如果它已經存在於「Fruit」欄中。否則，它應該返回到「Strawberry」。

我試圖做到這一點，像這樣：

在ng-focus，我打電話recordValue()。這將獲取整行，列和值，並將其設置爲一個單獨的變量。

在ng-blur，我打電話validateValue()，並檢查所有我行對

一）原行索引

B），看看是否值在表中的任何行已存在

c）如果存在，則保留它，否則恢復原始值

（使用原始行變量替換原始行索引處的編輯行）

但是，行I通過的是ng-model的row[column]（行中列的值）。這意味着我無法獲得該行的原始值，因爲它會在更改原始數據時更新原始數據。

爲了解決這個問題，我在數據上創建了一個$watch。如果$scope.validated的值爲true，請更新該表用作數據源的變量。否則，不要。當調用recordValue()時$scope.validated設置爲false，在遍歷validateValue()並查找值或重置它之後爲true。

問題是，數據仍然更新，所以我不能恢復該值，因爲原來的行不存在;當我遍歷數據源時，只有更新的行存在。我找不到原始行恢復爲。

我不知道爲什麼會發生這種情況。我做錯了什麼嗎？

HTML：

<table> 
    <tr> 
     <th ng-repeat="columnName in columnArray">{{columnName}}</th> 
    </tr> 
    <tr ng-repeat="row in filteredData"> 
     <td ng-repeat="columnName in columnArray"> 
      <input ng-model="row[columnName]" ng-focus="recordValue(row,row[column])" ng-blur="validateValue(row,column,row[column])"> 
     </td> 
    </tr> 
</table> 

角：

$scope.recordValue = function (row, val) { 
     $scope.originalRow = row; 
     $scope.originalValue = val; 
     $scope.validated = false; 
    }; 

    $scope.validateValue = function (row, column, val) { 
     // row is the row of data the text field is in 
     // column is column name at row 
     // val is value at column in row(ng-model on $scope.data) 
     var indexOfOriginalRow; 
     for (var i = 0; i < $scope.data.length; i++) { 
      var currentRow = $scope.data[i]; 
      if (currentRow == $scope.originalRow) { 
       console.log("found it!"); 
       indexOfOriginalRow = i; 
      } 
      else if (currentRow[column] == val) { 
       $scope.validated = true; 
       // the value was found, keep it as is 
       return; 
      } 
     } 
     $scope.validated = true; 
     $scope.data[index][column] = $scope.originalValue; 
    }; 

$scope.$watch("data", function() { 
     if ($scope.validated) { 
      $scope.filteredData = doStuffWithData($scope.data); 
     } 
    }, true); 

每一行是一個數組（數據源）內的對象。當值更改時，我更新PARENT數據源，但不更新表中使用的數據源。不幸的是，似乎表的數據源（filteredData）無論如何都會更新。

這可以防止我重置文本字段的值，因爲數據源中的值已更新，所以它似乎已經存在於表中。這似乎是一個邏輯錯誤，但很難概念化表和可變數據結構，所以我找不到錯誤。

UPDATE：

即使我只店的價值，而不是原始行的參考，更大的問題是，仍然是數據更新。原始行是無用的，因爲新行已經在數據源中，這意味着它將被查找，被視爲預先存在的值，並允許您輸入任何內容。非常令人沮喪。

Answer 1

嘗試使用angular.copy()將row的值存儲在$scope.originalRow中，而不綁定它們。

Answer 2

我想你會一直設置$scope.validated = true並返回，因爲你正在檢查更新後的值的更新行。嘗試添加一個else：

for (var i = 0; i < $scope.data.length; i++) { 
     var currentRow = $scope.data[i]; 
     if (currentRow == $scope.originalRow) { 
      console.log("found it!"); 
      indexOfOriginalRow = i; 
     } else if (currentRow[column] == val) { // ADDED ELSE 
      $scope.validated = true; 
      // the value was found, keep it as is 
      return; 
     } 
    }