AngularJS:实现动态添加多个输入控件功能

原创 星巴克摩卡 随笔 angularjs 278阅读 2018-01-09 10:42:09 举报

<div ng-repeat="item in DATA.data">
<div class="form-group">
<div class="col-md-12">
<label class="col-md-1" >{{$index + 1}}</label>
<div class="col-md-9"><input type="text" class="form-control" ng-model="item.value" name="item{{$index + 1}}" /></div>
<div><input type="button" ng-click="item.delete($index)" value="删除"></div>
</div>
</div>
</div
<div><input type="button" ng-click="add()" value="增加"></div>
//controller
testModule.controller('testController',
function ($scope, $log) {
$scope.DATA = new Object();
$scope.DATA.data = [{key: 0, value: ""}];

    // add  
     $scope.add = function($index) {                  
          // 用时间戳作为每个item的key               
         $scope.DATA.data.splice($index + 1, 0,{key: new Date().getTime(), value: ""});        
     }  

     // delete  
     $scope.DATA.delete = function($index) {            
        $scope.DATA.data.splice($index, 1);  
    }  

});

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复