欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

angularJS實(shí)現(xiàn)動態(tài)添加,刪除div方法

 更新時間：2018年02月27日 14:32:31   作者：悶葫蘆-  
下面小編就為大家分享一篇angularJS實(shí)現(xiàn)動態(tài)添加,刪除div方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

要實(shí)現(xiàn)的功能類似下圖，動態(tài)添加或者刪除div

點(diǎn)擊 增加可添加一條div 點(diǎn)擊刪除可刪除一條div

HTML代碼如下：（省略CSS樣式代碼了大笑）

<div class="accordion-inner">
  <div class="alert alert-info fade in" ng-repeat="permission in permissions">授權(quán)給:
    <select id="" class="grantees" disabled="" style=" margin-bottom: 3px;" ng-model="permission.grantee">
      <option value="everyone">所有人</option>
      <option value="authenUsers">已認(rèn)證的用戶</option>
      <option value="me" selected="">我自己</option>
    </select>
    <input type="checkbox" checked="" class="permissions" disabled="" ng-model="permission.port1">Open/Download
    <input type="checkbox" checked="" class="permissions" disabled="" ng-model="permission.port2">View Permissions
    <input type="checkbox" checked="" class="permissions" disabled="" ng-model="permission.port3">Edit Permissions
    <button class="btn" type="button" style="float: right;" ng-click="delPermission($index)">刪除</button>
  </div>
  <div>
    <button class="btn" type="button" ng-click="addPermission($index)">增加訪問許可</button>
  </div>
  <br>
  <div>
    <button class="btn btn-primary" type="button">保存</button>
    <button class="btn" type="button">取消</button>
  </div>
</div>

添加和刪除的JS代碼分別如下：

//增加許可訪問div
$scope.permissions = [{grantee: "",port1:"",port2:"",port3:""}];
$scope.addPermission = function($index){
  $scope.permissions.splice($index + 1, 0,
    {grantee:"", port1:"",port2:"",port3:""});
}
//刪除許可訪問div
$scope.delPermission = function($index){
  $scope.permissions.splice($index, 1);
}

以上這篇angularJS實(shí)現(xiàn)動態(tài)添加,刪除div方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論