angularJs增加行的操作

angularJs增加行的操作

class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  
class="modal-dialog" >
    
class="modal-content">
        
class="modal-header">
            "button" class="close" data-dismiss="modal" aria-hidden="true">×
            
"myModalLabel">规格编辑
        
        
class="modal-body">                            
            
            class="table table-bordered table-striped"  width="800px">
                  

                      
规格名称
                      
class="form-control" placeholder="规格名称" ng-model="entity.specification.specName">  
                  
             
                
             
             
             
class="btn-group">
                  "button" class="btn btn-default" title="新建" ng-click="addTableRow()">class="fa fa-file-o"> 新增规格选项
                  
             
             
             class="table table-bordered table-striped table-hover dataTable">
                    "pojo in entity.specificationOptionList">
                           
                            

                        

                          
                     
                      
class="sorting">规格选项
                      
class="sorting">排序
                                                                
                      
class="sorting">操作
    
                    
                    

                      

                                class="form-control" placeholder="规格选项" ng-model="pojo.optionName"> 
                            
                            

                                class="form-control" placeholder="排序" ng-model="pojo.orders"> 
                            
                            

                                "button" class="btn btn-default" title="删除" ng-click="deleTableRow($index)" >class="fa fa-trash-o"> 删除
                            
                      
                     
                    
              
 
            
            
        

 

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

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

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

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

posted @ 2019-02-13 14:07 动手的程序员 阅读( ...) 评论( ...) 编辑 收藏