angularJS实现动态添加和删除div

html代码：

 1 <table class="table table-striped text-center table-hover table-bordered">
 2         <thead>
 3             <tr>
 4                 <th><span>data1</span></th>
 5                 <th>data2</th>
 6                 <th>data3</th>
 7                 <th>Operation</th>
 8             </tr>
 9         </thead>
10         <tbody>
11             <tr ng-repeat="pa in paramenters">
12                 <td>{{pa.data1}}</td>
13                 <td>{{pa.data2}}</td>
14                 <td>{{pa.data3}}</td>
15                 <td><span ng-click="deleteTablerow($index)">删除</span></td>
16             </tr>
17         </tbody>
18     </table>
19     <button ng-click="addTablerow1()">在末尾添加一行</button>
20     <button ng-click="addTablerow2()">在开头添加一行</button>

js代码：

 1 //add table row
 2      $scope.paramenters = [
 3       {data1: "data1",data2:"gege",data3:"fafsf"},
 4       {data1: "geg",data2:"dhdh",data3:"hshasdhd"}
 5     ];  
 6     $scope.addTablerow1 = function(){ 
 7       $scope.paramenters.splice($scope.paramenters.length + 1, 0, {
 8         data1:"",
 9         data2:"",
10         data3:""
11       });  
12     } 
13     $scope.addTablerow2 = function(){ 
14       $scope.paramenters.splice(0, 0, {
15         data1:"",
16         data2:"",
17         data3:""
18       });  
19     } 
20     $scope.deleteTablerow = function ($index) {
21       $scope.paramenters.splice($index, 1);  
22     }