Angular：如何保存編輯的值？

這裏是我的plnkr http://plnkr.co/edit/0W1SZll1BOK5uuEtdycy?p=preview Angular：如何保存編輯的值？

即時通訊嘗試從我的編輯聯繫人模式保存編輯的值。

這裏是一個編輯方法，從對象取當前值：

$scope.edit = function(terminal) { 
$scope.name = terminal.name; 
$scope.last = terminal.last; 
$scope.age = terminal.age; 
}

我讀到的角度副本，有什麼事嗎？任何人都可以幫助我請病態眼光學習如何做到這一點

來源

2017-04-15 torresito

您不使用在ng-model一個對象創建了很多額外的手工工作第一個地方，而不是使用單個範圍屬性。

有一個黃金法則也是if you don't have a dot in ng-model you are doing it wrong

做這樣的事情：

$scope.edit = function(terminal) { 
    // store reference to terminal being edited 
    $scope.currentTerminal = terminal; 
    // make a copy so live one is not affected -- will be used in form 
    $scope.terminal = angular.copy(terminal); 
} 

$scope.save = function(){ 
    // update stored original with changes 
    angular.extend($scope.currentTerminal, $scope.terminal); 
    // reset terminal used in form 
    $scope.terminal ={}; 
}

我強烈建議你擺脫的jQuery：

<input ng-model="terminal.name"> 
<input ng-model="terminal.age">

然後大意如下工作和bootstrap.js並使用angular-ui-bootstrap insted

來源

2017-04-15 19:42:42 charlietfl

謝謝charlietfl，有一個問題：即時將數據保存到數據庫與PHP，我需要新的功能來保存編輯值？或擴展方法自動執行？ – torresito

所有更理由使用一個對象...非常簡單，將其粘貼到一個'$ http'並且只更新成功的視圖版本 – charlietfl

嗨charlietfl，試圖用像udd這樣的點來做ngmodel，但是當我點擊編輯按鈕，然後添加按鈕，添加表單輸入中有值 – torresito

當分配對象或數組的值到另一個變量，並且該對象值不應該改變時使用angular.copy。

如果不進行深度複製或使用angular.copy，則更改屬性值或添加任何新屬性會更新引用同一對象的所有對象。您的JS將如下所示：

$scope.edit = function(terminal) { 
    $scope.name = angular.copy(terminal.name); 
    $scope.last = angular.copy(terminal.last); 
    $scope.age = angular.copy(terminal.age); 
    }

來源

2017-04-15 18:59:29 hamzox

謝謝hamza，h一個問題：即時將數據保存到數據庫與PHP，我需要新的功能來保存編輯值？或複製方法自動執行？ – torresito

將這些值放在一些額外的javascript變量中，使用相同的angular.copy，而不是一些額外的$ scope變量，因爲$ scope告訴我們什麼值將與我們的視圖綁定。 – hamzox

您需要傳遞要編輯的行的索引。當你點擊編輯按鈕時通過索引。

中的script.js變化

$scope.edit = function(terminal,index) { 

    $scope.name = terminal.name; 
    $scope.last = terminal.last; 
    $scope.age = terminal.age; 
    $scope.edit_index = index 

} 


$scope.saveEdit =function(){ 
    index = $scope.edit_index 
    $scope.terminals[index].name = $scope.name; 

    }

index.html中更改

<td> <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#editModalLong" ng-click="edit(terminal,$index)">Edit</button> 

<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="saveEdit()">Save</button>

http://plnkr.co/edit/GpVB2dUiHCY6NslQDuBe?p=preview

來源

2017-04-15 19:27:41

Angular：如何保存編輯的值？

回答

相關問題