更新时间:2023-12-04 12:09:22
首先,使其更容易遍历行.您需要N行,并且每行应具有两条信息:名称和地址.
First, make it easier to iterate through the rows. You want N rows, and each row should have two pieces of information: a name and an address.
所以不要使用两个数组.使用行的一个数组,其中每行都有一个名称和地址:
So don't use two arrays. Use one array, of rows, where each row has a name and an address:
$scope.rows = [
{
name: 'name 1',
address: 'address 1'
},
{
name: 'name 2',
address: 'address 2'
}
];
要添加一行,您只需要
$scope.rows.push({
name: '',
address: ''
});
要遍历各行,您所需要做的只是
To iterate on the rows, all you need is
<tr ng-repeat="row in rows">
<td>{{$index+1}}</td>
<td><input type="text" ng-model="row.name" /></td>
<td><input type="text" ng-model="row.address" /></td>
<td><input type="button" ng-click="removeRow(row)" value="Remove" /></td>
</tr>
如您所见,您需要在removeRow函数中传递什么行以将其删除.
As you see, you need to pass what row to remove in your removeRow function.
要删除该行,您所需要做的就是在$ scope.rows中找到其索引,然后删除该索引:
And to remove the row, all you need is to find its index in $scope.rows, and remove that index:
$scope.removeRow = function(row) {
var index = $scope.rows.indexOf(row);
$scope.rows.splice(index, 1);
}
我不知道每一行应该代表什么.例如,我想可能是用户,所以可以随意将行重命名为用户,然后将行重命名为user.命名事物并拥有一个好的,正确的模型是关键.您的页面显示一个用户表.不是两个名称和地址表.
I don't know exactly what each row is supposed to represent. I guess it might be a user, for example, so feel free to rename rows to users, and row to user. Naming things, and having a good, correct model, is the key. Your page displays a table of users. Not two tables of names and addresses.