下面我就为大家分享一篇angularjs动态添加数据并删除的实例,具有很好的参考价值,希望对大家有所帮助。
如下所示:
nbsp;html>TodoList body {padding: 0;margin: 0;}.todo {width: 300px;margin: 100px auto;}.todo dd {overflow: hidden;}.todo input[type="checkbox"] {float: left;}.todo a {float: right;}
登录后复制待办事项{{todo.text}}删除已办事项{{doneTodos.length}}{{todo.text}}删除// 定义一个模块var App = angular.module('App', []);// 定义一个控制器App.controller('TodoListController', ['$scope', function($scope) {// 待办事项$scope.todos = [];// 已完成事项$scope.doneTodos = [];// $scope.todo = '';// 回车时调用ng-submit,往待办事项中添加数据$scope.addItem = function () {// 向数组中添加数据$scope.todos.push({text:$scope.todo, checked: false});// 清空输入框$scope.todo = '';}// 勾选时完成$scope.done = function (index, ev) {// console.log(index);// console.log($scope.todos);// 从待办事项中删除var tmp = $scope.todos.splice(index, 1);tmp[0].checked = !tmp[0].checked;// 将删除的事项添加到已完成里$scope.doneTodos = $scope.doneTodos.concat(tmp);ev.preventDefault();}// 取消已完成$scope.undone = function (index, ev) {// 从已完成数据中删除var tmp = $scope.doneTodos.splice(index, 1);tmp[0].checked = !tmp[0].checked;// 将事项添加到待办事项中$scope.todos = $scope.todos.concat(tmp);// ev.preventDefault();}// 删除事项,传递当前索引和完整数据$scope.delete = function (index, todos) {// $scope.doneTodos.splice(index, 1);// console.log(todos);// 删除索引值对应的事项todos.splice(index, 1);}}])// var arr = [0, 1, 2, 3, 4];// arr.splice(2,1)
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
详细讲解FastClick源码(详细教程)
利用vue和element-ui如何实现表格内容分页
利用vue如何实现将时间戳转换成自定义时间格式
以上就是在AngularJS中如何动态添加数据并删除?的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2750073.html