大家好,我是angularJs中的新成員。我想在表格中編輯它之後更新表格中的單行而不是整個表格。如何使用angular js更新後更新單行
Here I am trying to create a table without ng-repeat.
大家好,我是angularJs中的新成員。我想在表格中編輯它之後更新表格中的單行而不是整個表格。如何使用angular js更新後更新單行
Here I am trying to create a table without ng-repeat.
最終溶液..
<!DOCTYPE html>
<html ng-app="app" ng-controller="ctrl">
<head>
<title>My ParseApp site</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script>
</head>
<body>
<form ng-show="update">
user <input type="text" ng-model="upname.name" /> <button ng-click="updateTable(upname)">save</button>
</form>
<table>
<tr ng-repeat="info in infos">
<td ng-bind="info.name"></td>
<td ng-bind="info.lastname" ></td>
<td>
<button ng-click="updateMe(info)">click to edit</button>
</td>
</tr>
</table>
<script>
var app = angular.module('app', []);
app.controller("ctrl", function($scope) {
$scope.infos = [{
name: "user1",id:0,lastname:"abc"
}, {
name: "user2",lastname:"abc",id:1
}, {
name: "user3",lastname:"abc",id:2
}, {
name: "user4",lastname:"abc",id:3
}];
$scope.updateMe = function(object) {
$scope.upname = object;
$scope.update=true;
}
$scope.updateTable = function(object){
}
})
</script>
</body>
</html>
<!DOCTYPE html>
<html ng-app="app" ng-controller="ctrl">
<head>
<title>My ParseApp site</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script>
</head>
<body>
<table>
<tr ng-repeat="info in infos">
<td ng-hide="info.update" ng-bind="info.name"></td>
<td ng-show="info.update">
<input type="text" ng-model="info.name" />
</td>
<td>
<button ng-click="updateMe(info)">click to edit</button>
</td>
</tr>
</table>
<script>
var app = angular.module('app', []);
app.controller("ctrl", function($scope) {
$scope.infos = [{
name: "user1"
}, {
name: "user2"
}, {
name: "user3"
}, {
name: "user4"
}];
$scope.updateMe = function(object) {
object.update ? object.update = false : object.update = true;
}
})
</script>
</body>
</html>
你有一些代碼可以顯示嗎?你的桌子是什麼樣的?你的表格呢? – bstockwell
在plunker上提供代碼 –
爲什麼你試圖創建一個沒有ng-repeat的表!這是完全錯誤的方式...... ng-repeat幫助你獲得你所有的數據。 – Maher