• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

angular动态删除ng-repaeat添加的dom节点的方法

angularjs 搞代码 4年前 (2021-12-31) 33次浏览 已收录 0个评论

本篇文章主要介绍了angular动态删除ng-repaeat添加的dom节点的方法,非常具有实用价值,需要的朋友可以参考下

本文介绍了angular动态删除ng-repaeat添加的dom节点的方法,分享给大家供大家参考,具体如下:

通过点击删除按钮删除数据库信息以及当前行

html代码如下:

 <div class="row"> <div class="col-xs-12"> <!-- PAGE CONTENT BEGINS --><div class="row"> <div class="col-xs-12"> <table id="simple-table" class="table table-bordered table-hover"> <thead> <tr> <th>姓名</th><th>学历</th><th class="hidden-480">专业</th><th> <i class="ace-icon fa fa-clock-o bigger-110 hidden-480"></i> 工作时间 </th><th class="hidden-480">工作经历</th><th></th></tr></thead><tbody> <tr class="hang">//通过ng-repeat迭代创建dom <td> {{x.name}}</td><td>{{x.education}}</td><td class="hidden-480">{{x.major}}</td><td>{{x.workYear+'年'}}</td><td class="hidden-480"> {{x.workExperience}} </td><td> <div class="hidden-sm hidden-xs btn-group"> <button class="btn btn-xs btn-success"> <i class="ace-icon fa fa-check bigger-120"></i></button><button class="btn btn-xs btn-info"> <i class="ace-icon fa fa-pencil bigger-120"></i></button><button class="btn btn-xs btn-danger"> <i class="ace-icon fa fa-trash-o bigger-120"></i></button><button class="btn btn-xs btn-warning"> <i class="ace-icon fa fa-flag bigger-120"></i></button></div><div class="hidden-md hidden-lg"> <div class="inline pos-rel"> <button class="btn btn-minier btn-primary dropdown-toggle"> <i class="ace-icon fa fa-cog icon-only bigger-110"></i></button><ul class="dropdown-menu dropdown-only-icon dropdown-yellow dropdown-menu-right dropdown-caret dropdown-close"> <li>  <span class="blue"> <i class="ace-icon fa fa-search-plus bigger-120"></i></span></li><li>  <span class="green"> <i class="ace-icon fa fa-pencil-square-o bigger-120"></i></span></li><li>  <span class="red"> <i class="ace-icon fa fa-trash-o bigger-120"></i></span></li></ul></div></div></td></tr></tbody></table></div><!-- /.span --></div><!-- /.row --><!-- PAGE CONTENT ENDS --></div><!-- /.col --></div><!-- /.row -->

js代码如下:

 angular.controller('tables',function ($scope,$http) { $http({ method: 'GET', url:'resumes/myResume/'+USER.id }).then(function success(rep) { $scope.jl=rep.data; }); $scope._delete<mark style="color:transparent">来源gaodaimacom搞#^代%!码网</mark>=function (idx) { $scope.id=$scope.jl[idx].id; $http({ method:'DELETE', url:'resumes/'+$scope.id }).then(function success(rep) { $scope.jl.splice(idx, 1);//截取数组,删除当前行 }); } }); 

以上就是angular动态删除ng-repaeat添加的dom节点的方法的详细内容,更多请关注gaodaima搞代码网其它相关文章!


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:angular动态删除ng-repaeat添加的dom节点的方法
喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址