<!-- 编辑窗口 -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog" >
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">规格编辑</h3>
</div>
<div class="modal-body"> <table class="table table-bordered table-striped" width="800px">
<tr>
<td>规格名称</td>
<td><input class="form-control" placeholder="规格名称" ng-model="entity.specification.specName"> </td>
</tr>
</table> <!-- 规格选项 -->
<div class="btn-group">
<button type="button" class="btn btn-default" title="新建" ng-click="addTableRow()"><i class="fa fa-file-o"></i> 新增规格选项</button> </div> <table class="table table-bordered table-striped table-hover dataTable">
<thead>
<tr> <th class="sorting">规格选项</th>
<th class="sorting">排序</th>
<th class="sorting">操作</th>
</thead>
<tbody>
<tr ng-repeat="pojo in entity.specificationOptionList"> <td>
<input class="form-control" placeholder="规格选项" ng-model="pojo.optionName">
</td>
<td>
<input class="form-control" placeholder="排序" ng-model="pojo.orders">
</td>
<td>
<button type="button" class="btn btn-default" title="删除" ng-click="deleTableRow($index)" ><i class="fa fa-trash-o"></i> 删除</button>
</td>
</tr> </tbody>
</table> </div>
    //$scope.entity={specificationOptionList:[]};

    //增加规格选项行
$scope.addTableRow=function(){
$scope.entity.specificationOptionList.push({});
} //删除规格选项行
$scope.deleTableRow=function(index){
$scope.entity.specificationOptionList.splice(index,);
}

具体思路:是由于在里面是一个循环体绑定了数据,向数据中添加一个空数据,所以就可以进行了,就可以添加一行了

   <div class="pull-left">
<div class="form-group form-inline">
<div class="btn-group">
<button type="button" class="btn btn-default" title="新建" data-toggle="modal" data-target="#editModal" ng-click="entity={specificationOptionList:[]}"><i class="fa fa-file-o"></i> 新建</button>
<button type="button" class="btn btn-default" title="删除" ng-click="dele()"><i class="fa fa-trash-o"></i> 删除</button> <button type="button" class="btn btn-default" title="刷新" onclick="window.location.reload();"><i class="fa fa-refresh"></i> 刷新</button>
</div>
</div>
</div>

使用$index就可以获取当前行的索引,来删除相应的行

angularJs增加行的操作的更多相关文章

  1. DataTable数据类型的一些操作 增加行、插入行、修改数据、修改列名、修改列顺序、计算、选取或删除行(列)、排序、某列distinct值 等

    Datatable 这个数据类型在C#中涉及到对数据库读取时的用处还是挺大的,最近在处理一个报表开发时,一开始把所有的操作都放在sql 上面来做,就是我需要什么样的数据我就query出什么,但是这样其 ...

  2. poi读取Excel模板并修改模板内容与动态的增加行

    有时候我们可能遇到相当复杂的excel,比如表头的合并等操作,一种简单的方式就是直接代码合并(浪费时间),另一种就是写好模板,动态的向模板中增加行和修改指定单元格数据. 1.一个简单的根据模板shee ...

  3. js 动态增加行删除行

    <body> <table id="tableID" border="1" align="center" width=&q ...

  4. mongoVUE的增删改查操作使用说明

    mongoVUE的增删改查操作使用说明 一. 查询 1. 精确查询 1)右键点击集合名,再左键点击Find 或者直接点击工具栏上的Find 2)查询界面,包括四个区域 {Find}区,查询条件格式{& ...

  5. (转)SQLite数据库增删改查操作

    原文:http://www.cnblogs.com/linjiqin/archive/2011/05/26/2059182.html SQLite数据库增删改查操作 一.使用嵌入式关系型SQLite数 ...

  6. jquery plugins —— datatables 增加行号

    table = $("#Table").DataTable({ "rowCallback": function (row, data, dataIndex) { ...

  7. 详谈easyui datagrid增删改查操作

    转自:http://blog.csdn.net/abauch_d/article/details/7734395 前几天我把easyui dadtagrid的增删改查的实现代码贴了出来,发现访问量达到 ...

  8. Python教程:连接数据库,对数据进行增删改查操作

    各位志同道合的同仁可以点击上方关注↑↑↑↑↑↑ 本教程致力于程序员快速掌握Python语言编程. 本文章内容是基于上次课程Python教程:操作数据库,MySql的安装详解 和python基础知识之上 ...

  9. PHP程序中使用PDO对象实现对数据库的增删改查操作的示例代码

    PHP程序中使用PDO对象实现对数据库的增删改查操作(PHP+smarty) dbconn.php <?php //------------------------使用PDO方式连接数据库文件- ...

随机推荐

  1. tomcat 三种部署方式以及server.xml文件的几个属性详解

    一.直接将web项目文件件拷贝到webapps目录中 这是最常用的方式,Tomcat的Webapps目录是Tomcat默认的应用目录,当服务器启动时,会加载所有这个目录下的应用.如果你想要修改这个默认 ...

  2. leetcode482

    这道题主要使用了C++的几个API,大小写转化,字符串替换.其余的逻辑都比较简单.而且经查资料,string类字符串拼接的速度使用+=的速度是很快的.以下代码,也是用的+=来拼接字符串. string ...

  3. windows 修改端口数据及连接时间

    最近线上遇到windows机器访问其他机器的时候失败的情况.实际就是本地的端口不够用造成的. D:\>netsh interface ipv4 show dynamicportrange pro ...

  4. AndroidStudio 中使用FFMPEG

    1.下载 FFmpeg 源码 git clone https://git.ffmpeg.org/ffmpeg.git 这一步可能会花比较长的时间 2.编译 FFmpeg for Android 2.1 ...

  5. vmstat详细说明

    下面是关于Unix下vmstat命令的详细介绍,收录在这里,以备日后参考 vmstat是用来实时查看内存使用情况,反映的情况比用top直观一些.作为一个CPU监视器,vmstat命令比iostat命令 ...

  6. linux设置自动获取IP地址

    右键单击,选择设置 勾选桥接模式

  7. PHP算法

    一,实现快速排序 <?php function quickSort($arr) { $len=count($arr) ; if($len<=1) { return $arr; } $key ...

  8. Django框架 之 Cookie和Session初识

    Django框架 之 Cookie和Session初识 浏览目录 Cookie介绍 Django中的Cookie Session 一.Cookie介绍 1.Cookie产生的意义 众所周知,HTTP协 ...

  9. Python程序设计6——面向对象

    面向对象有三大特征:多态(对应方法覆写).封装.继承(对应方法重载),这个在Java中已经说得很详细了,这里面只是介绍Python在这三个特性方面的实现. 1 创建自定义类 Python和Java一样 ...

  10. Sequoiadb该如何选择合适的SQL引擎

    Sequoiadb作为一个文档型NoSQL数据既可以存储结构化数据也可以存储非结构化数据,对于非结构化数据只能使用原生的API进行查询,对结构化数据我们可以选择使用原生的API和开源SQL引擎,目前P ...