获取ng-repeat中的row's索引(或id),以便对特定行执行一些操作
Get row's index (or id) inside ng-repeat to do some actions on a specific row
我是新的角度,我想获得特定行的索引来执行函数hidestuff()
,我将item.id
传递给函数,我想隐藏包含此id的行。但是我如何传递行索引来删除整个行呢?
<tr ng-repeat="item in ItemsByPage[currentPage]">
<td>
<div ng-model="tid"
ng-hide="hidden"
ng-class="{fade: startFade}">
{{item.id}}
</div>
</td>
<td>
<div editable-text="item.name"
onaftersave='inlineupdateName(item.id,item.name)'
ng-model="tname" data-n='item.name'>
{{item.name}}
</div>
</td>
<td>
<div editable-text="item.phone"
onaftersave='inlineupdatephone(item.id,item.phone)'
ng-model="tphone">
{{item.phone}}
</div>
</td>
</tr>
<input type="text" ng-model="delId" class="form-control"
placeholder="Enter user id to delete th user">
<button ng-click="deleteuser(delId)" type="button"
class="btn btn-primary">
Delete User
</button>
js:
$scope.hideStuff = function (delId) {
$scope.startFade = true;
//here i want to use the index to delete the row
$scope.hidden = true;
};
$scope.deleteuser = function (dalId) {
var data = {delId : $scope.delId};
$http.post('delete.php', data )
.success(function(response) {
$scope.hideStuff(delId);
});
};
你可以使用$index。https://docs.angularjs.org/api/ng/directive/ngRepeat
我认为你应该这样做:
<tr id="tr-{{item.id}}" ng-repeat="item in ItemsByPage[currentPage]">
<td>
<div>
{{item.id}}
</div>
</td>
<td>
<div editable-text="item.name"
onaftersave='inlineupdateName(item.id,item.name)'
ng-model="tname" data-n='item.name'>
{{item.name}}
</div>
</td>
<td>
<div editable-text="item.phone"
onaftersave='inlineupdatephone(item.id,item.phone)'
ng-model="tphone">
{{item.phone}}
</div>
</td>
</tr>
<input type="text" ng-model="delId" class="form-control"
placeholder="Enter user id to delete th user">
<button ng-click="deleteuser(delId)" type="button"
class="btn btn-primary">
Delete User
</button>
js
$scope.hideStuff = function (delId) {
$("#tr-"+delId).hide();
//the entire tr (line table) will be hidden.
// you don't need those $scope variables to hide the elements
};
$scope.deleteuser = function (dalId) {
var data = {delId : $scope.delId};
$http.post('delete.php', data )
.success(function(response) {
$scope.hideStuff(delId);
});
};
相关文章:
- Jquery表单验证插件-如果选中复选框,如何在提交时执行某些操作
- Google 脚本:用于创建日历活动的脚本运行时不会出错,但不会执行任何操作
- 当通过AJAX调用时,控制器操作不会执行
- jQuery-将列表项的一个元素移动到同一项的另一个元素中+对我的列表中的每个项执行此操作
- 点击:更改位置后执行某些操作
- 无法执行文件.退出Acrobat PDF中的操作
- 从表单中获取用户输入执行计算(操作顺序)并输出回该表单
- 如何在ListView项模板中获取按钮来执行不同的操作
- 单击元素两次后执行操作
- ReactJS只有在操作完成后才能执行某些操作
- toogleClass函数来切换元素类并在事件期间执行某些操作
- jQuery/Javascript foreach If/Else |如果为空(不执行任何操作)Else(显示forea
- Var工作,但在使用数组执行相同操作时停止
- 如何在mvc3中执行操作而不更改当前页面
- jQuery:$.ajax() 重定向到其 URL 表单操作参数,而不是对表单操作执行 AJAX 请求
- 如何为多个操作执行简单的 jQuery
- Redux 转换到操作执行后
- 反流操作执行后触发通知/回调
- jquery如果按钮点击了执行其他操作执行其他操作
- 在操作执行之前禁用锚链接