angular 選擇刪除 小功能

要實現的功能，如圖：

html代碼：

編輯按鈕代碼：

<button ng-if="noteTabs[0].active" class="button button-icon" ng-click="privateNote_edit()">{{privateNoteEditAndCancel}}</button>

列表代碼：

<ion-list show-delete="flag.showDelete">
   <ion-item ng-repeat="privateNote in privateNoteList" class="item item-icon-left item-icon-right" ng-click="private_note()">
      <i class="icon ion-ios-list-outline assertive"></i>
       {{privateNote.title}}
       <span class="private-time-date">
           <i class="icon ion-ionic ion-share assertive x2b-note-public-share"></i>
           {{privateNote.datetime}}
       </span>
       <ion-delete-button  ng-init="privateNote.checked = false;" ng-class="{true: 'ion-ios-checkmark', false: 'ion-ios-circle-outline'}[privateNote.checked]" ng-click="noteChecked(privateNote);"></ion-delete-button>			
     </ion-item>
 </ion-list>

全選，刪除 代碼

 <a class="button button-stable button-clear red" ng-click="selectAll()">{{allSelectOrNot}}</a>
 <a class="button button-stable button-clear blue" ng-click="deleteAll()">刪除</a>

js代碼：

.controller('CourseNoteCtrl', ['$scope', '$state', '$location', 'Course', '$stateParams', 'Utilities', 'constant', 'AppAgent', '$window', 'socialSharing', 
    function($scope, $state, $location, Course, $stateParams, Utilities, constant, AppAgent, $window, socialSharing) {
      $scope.courseNoteTitle = socialSharing.getTitle();

      // var detailId = $stateParams.courseId;
      // Course.getCourseInfo(detailId).then(function(data) {
      //   $scope.courseInfo = data;
      //   alert(courseInfo.name);
      // });

      $scope.privateNoteList = [{
        title: "個人筆記1111111",
        datetime: "YYYY/MMM/DD hh:mm"
      }, {
        title: "個人筆記2",
        datetime: "YYYY/MMM/DD hh:mm"
      }, {
        title: "個人筆記3",
        datetime: "YYYY/MMM/DD hh:mm"
      }, {
        title: "個人筆記4",
        datetime: "YYYY/MMM/DD hh:mm"
      }, {
        title: "個人筆記5",
        datetime: "YYYY/MMM/DD hh:mm"
      }];
      
      $scope.triggerSubTabs = function(tabName) {
        var i = $scope.noteTabs.length;

        while (i--) $scope.noteTabs[i].active = $scope.noteTabs[i]['name'] == tabName ? true : false;
        angular.element($window).bind('orientationchange', function() {
          $scope.$apply();
        });
      };

      // $scope.private_note = function() {
      //   $state.go('course.ClassNote.PrivateNote');
      // };

      // $scope.public_note = function() {
      //   $state.go('course.ClassNote.PublicNote');
      // };

      $scope.flag = {showDelete:false};

      $scope.privateNoteEditAndCancel = "編輯";
      $scope.privateNoteEditState = false;
      
      
     //編輯按鈕
      $scope.privateNote_edit = function() {
        //$scope.privateNoteEditState = $scope.privateNoteEditState == true ? false : true;
        $scope.flag.showDelete=!$scope.flag.showDelete;
        $scope.privateNoteEditState = !$scope.privateNoteEditState
        if ($scope.privateNoteEditState == true) {
           $scope.privateNoteEditAndCancel = "取消";
        } else {
          $scope.privateNoteEditAndCancel = "編輯";
        }
      };
      
      
     //選擇取消
      $scope.noteChecked = function(privateNote) {
        privateNote.checked = !privateNote.checked;
        //alert(privateNote.checked);
        
       };

      $scope.allSelectOrNot = "全選";
      //$scope.allSelectMode = false;
      //全選
      $scope.selectAll =function(){
        for(var i =0 ; i<$scope.privateNoteList.length;i++){
          $scope.privateNoteList[i].checked =true;
          //alert( $scope.privateNoteList[i].checked);
        }

      }
      
      //刪除
      $scope.deleteAll =function(){
        for(var i =0 ; i<$scope.privateNoteList.length;i++){
           if($scope.privateNoteList[i].checked ===true){
              //alert($scope.privateNoteList[i].checked +$scope.privateNoteList[i].title);
              $scope.privateNoteList.splice(i,1);
              i--;
           }
        }
        //return $scope.privateNoteList.splice(i,1);
      }
    }
  ])

註釋：