宝哥软件园

AngularJS使用ng-repeat和ng-if实现数据的删除和显示效果[适用于表单数据的显示]

编辑:宝哥软件园 来源:互联网 时间:2021-09-06

本文通过一个实例讲述了AngularJS使用ng-repeat和ng-if来达到删除和显示数据的效果。分享给大家参考,如下:

1.首先,反复检查ng-repeat命令

Ng-repeat可以实现内容的重复显示,例如,我们可以编写以下代码

编写angular.module脚本(' myapp ',[])。控制器(' mycontroller ',函数($ scope){ $ scope . data=[{ name : ' yu1 ',age:10,partment 3360 ' product department ' },{name:' yu2 ',age:11,partment : ' product department ' },{name:' yu3 ',age:12,partment : ' business department ' },{ name: ' yu4 '

2.此时的问题是,如果我们要删除部门为“产品部门”的员工,

然后可以使用ng-repeat ng-if的方法,这样就可以实现简单的前端删除

我们只需要简单地添加ng-if='成员。零件=='产品部门会做' ng-repeat后。

按如下方式修改代码:

Tr ng-repeat='数据中的成员' ng-if='成员。part=='产品部门'效果是:

更多对AngularJS感兴趣的读者可以查看本网站的主题:《AngularJS入门与进阶教程》和《AngularJS MVC架构总结》

希望本文对AngularJS编程有所帮助。

更多资讯
游戏推荐
更多+