gpt4 book ai didi

javascript - 如何收集 AngularJS 中已选择的行的数据?

转载 作者:行者123 更新时间:2023-12-03 06:22:29 27 4
gpt4 key购买 nike

我正在从服务器接收数据列表,并使用 ng-repeat 以及每行中的复选框以表格格式显示该列表。我的要求是在单击“removeUserData”按钮时将选定的行传递回服务器。我面临着完成任务的问题,我们将不胜感激。

<table border="2" border-color=black>
<tr data-ng-repeat="user in users">
<td><input type="checkbox"></td><td>{{user.id}}</td><td>{{user.country}}</td><td>{{user.name}}</td>
</tr>
</table><br>
<button data-ng-click="removeUserData()" data-ng-show="users.length">Remove User</button>

最佳答案

我建议您在users中使用new属性,例如removed,那么当checkbox选中时,它将是true,否则false

看到它工作:

(function() {
angular
.module("app", [])
.controller('MainCtrl', MainCtrl);

MainCtrl.$inject = ['$scope'];

function MainCtrl($scope) {
$scope.removeUserData = removeUserData;

$scope.users = [
{
"id":1,
"country":"Italy",
"name":"Pavarotti"
},
{
"id":2,
"country":"French",
"name":"Some user"
}
];

function removeUserData() {
$scope.users = $scope.users.filter(function(user) {
return !user.removed;
})
}
}
})();
<!DOCTYPE html>
<html ng-app="app">

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
</head>

<body ng-controller="MainCtrl">
<table>
<tr ng-repeat="user in users">
<td>
<input type="checkbox" ng-model="user.removed">
</td>
<td ng-bind="user.id"></td>
<td ng-bind="user.country"></td>
<td ng-bind="user.name"></td>
</tr>
</table>
<div ng-if="users.length">
<hr>
<button ng-click="removeUserData()">Remove User</button>
</div>

</body>

</html>

关于javascript - 如何收集 AngularJS 中已选择的行的数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38805775/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com