刪除按鈕不是檢測第一個列表項

Question

選擇第一個列表後，刪除按鈕不會刪除第一個列表。

請幫我解決問題。這是代碼。

<div class="" ng-app="myApp" ng-controller="myController"> 
<table class="table table-striped table-condensed greyheader"> 
         <tr> 
         <th width="2.6%">row</th> 
         <th width="7.6%">From</th> 
         <th width="7.6%">To</th> 
         <th width="4.6%">CPT</th> 
         <th width="4.6%">Diag</th> 
         <th width="4.6%">Unit</th> 
         <th width="5.6%">Amount</th> 
         <th width="4.6%">POS</th> 
         <th width="4.6%">TOS</th> 
         <th width="4.6%">Mod 1</th> 
         <th width="4.6%">Mod 2</th> 
         <th width="4.6%">Mod 3</th> 
         <th width="4.6%">Mod 4</th> 
         <th width="4.6%">Copay</th> 
         <th width="15.6%">Description</th> 
         </tr> 
         <tr ng-repeat="item in bill_cpt track by $index" ng-click="cptlist_item()" class="" ng-data-label="{{ $index }}" ng-class="{{ cptselect }}"> 
         <td>{{ $index+1 }}</td> 
         <td>{{ item.cpt_bill_from }} </td> 
         <td>{{ item.cpt_bill_to }}</td> 
         <td>{{ item.cpt_bill_cpt }}</td> 
         <td>{{ item.cpt_bill_diag }}</td> 
         <td>{{ item.cpt_bill_unit }}</td> 
         <td>{{ item.cpt_bill_amount | currency }}</td> 
         <td>{{ item.cpt_bill_pos }}</td> 
         <td>{{ item.cpt_bill_tos }}</td> 
         <td>{{ item.cpt_bill_mod1 }}</td> 
         <td>{{ item.cpt_bill_mod2 }}</td> 
         <td>{{ item.cpt_bill_mod3 }}</td> 
         <td>{{ item.cpt_bill_mod4 }}</td> 
         <td>{{ item.cpt_bill_copay }}</td> 
         <td>{{ item.cpt_bill_description }}</td> 
         </tr> 
        </table> 

       <table class="table table-striped greyheader table-condensed responsiveTable"> 
        <tbody> 
         <tr class="bg-grey"> 
         <td width="6.6%"><label>From</label> 
          <input type="text" class="datepicker" ng-model="cpt_bill_from" /></td> 
         <td width="6.6%"><label>To</label> 
          <input type="text" class="datepicker" ng-model="cpt_bill_to" /></td> 
         <td width="6.6%"><label>CPT</label> 
          <input type="number" class="" ng-model="cpt_bill_cpt" /></td> 
         <td width="6.6%"><label>Diag</label> 
          <input type="number" class="" ng-model="cpt_bill_diag" /></td> 
         <td width="6.6%"><label>Unit</label> 
          <input type="number" class="" ng-model="cpt_bill_unit" /></td> 
         <td width="6.6%"><label>Amount</label> 
          <input type="number" class="" ng-model="cpt_bill_amount" /></td> 
         <td width="6.6%"><label>POS</label> 
          <input type="number" class="" ng-model="cpt_bill_pos" /></td> 
         <td width="6.6%"><label>TOS</label> 
          <input type="number" class="" ng-model="cpt_bill_tos" /></td> 
         <td width="6.6%"><label>Mod1</label> 
          <input type="number" class="" ng-model="cpt_bill_mod1" /></td> 
         <td width="6.6%"><label>Mod2</label> 
          <input type="number" class="" ng-model="cpt_bill_mod2" /></td> 
         <td width="6.6%"><label>Mod3</label> 
          <input type="number" class="" ng-model="cpt_bill_mod3" /></td> 
         <td width="6.6%"><label>Mod4</label> 
          <input type="number" class="" ng-model="cpt_bill_mod4" /></td> 
         <td width="6.6%"><label>Copay</label> 
          <input type="number" class="" ng-model="cpt_bill_copay" /></td> 
         <td width="6.6%"><label>Description</label> 
          <input type="text" class="" ng-model="cpt_bill_description" /></td> 
         </tr> 
        </tbody> 
        </table> 


        <div class="modal-footer"> 
       <button type="button" class="btn btn-default">OK</button> 
       <button type="button" class="btn btn-primary" ng-click="addBillCpt(item)">Add</button> 
       <button type="button" class="btn btn-danger" ng-click="removeBill_cpt()">Delete</button> 
       </div> 
</div> 



       <script> 
var myApp = angular.module('myApp', []); 

myApp.controller('myController', function($scope){ 

// add values in billing cpt list table 

    $scope.bill_cpt= [ 
    { 
    cpt_bill_from: 'July 23, 2016', 
    cpt_bill_to: 'July 23, 2016', 
    cpt_bill_cpt: 9925, 
    cpt_bill_diag: 12, 
    cpt_bill_unit: 1, 
    cpt_bill_amount: 100.00, 
    cpt_bill_pos: 1, 
    cpt_bill_tos: 1 , 
    cpt_bill_mod1: 01, 
    cpt_bill_mod2: 02, 
    cpt_bill_mod3: 25, 
    cpt_bill_mod4: 30, 
    cpt_bill_copay: 35, 
    cpt_bill_description: 'office/outpatient visit', 
    }, 
    { 
    cpt_bill_from: 'July 23, 2016', 
    cpt_bill_to: 'July 23, 2016', 
    cpt_bill_cpt: 1239925, 
    cpt_bill_diag: 12, 
    cpt_bill_unit: 1, 
    cpt_bill_amount: 100.00, 
    cpt_bill_pos: 1, 
    cpt_bill_tos: 1 , 
    cpt_bill_mod1: 01, 
    cpt_bill_mod2: 02, 
    cpt_bill_mod3: 25, 
    cpt_bill_mod4: 30, 
    cpt_bill_copay: 35, 
    cpt_bill_description: 'office/outpatient visit', 
    } 
    ] 


$scope.addBillCpt= function(){ 



     $scope.bill_cpt.push({ 
     cpt_bill_from: $scope.cpt_bill_from, 
     cpt_bill_to: $scope.cpt_bill_to, 
     cpt_bill_cpt: $scope.cpt_bill_cpt, 
     cpt_bill_diag: $scope.cpt_bill_diag, 
     cpt_bill_unit: $scope.cpt_bill_unit, 
     cpt_bill_amount: $scope.cpt_bill_amount, 
     cpt_bill_pos: $scope.cpt_bill_pos, 
     cpt_bill_tos: $scope.cpt_bill_tos, 
     cpt_bill_mod1: $scope.cpt_bill_mod1, 
     cpt_bill_mod2: $scope.cpt_bill_mod2, 
     cpt_bill_mod3: $scope.cpt_bill_mod3, 
     cpt_bill_mod4: $scope.cpt_bill_mod4, 
     cpt_bill_copay: $scope.cpt_bill_copay, 
     cpt_bill_description: $scope.cpt_bill_description, 
     }); 



     $scope.cpt_bill_from= '', 
     $scope.cpt_bill_to= '', 
     $scope.cpt_bill_diag= '', 
     $scope.cpt_bill_unit= '', 
     $scope.cpt_bill_amount= '', 
     $scope.cpt_bill_pos= '', 
     $scope.cpt_bill_tos= '', 
     $scope.cpt_bill_mod1= '', 
     $scope.cpt_bill_mod2= '', 
     $scope.cpt_bill_mod3= '', 
     $scope.cpt_bill_mod4= '', 
     $scope.cpt_bill_copay= '', 
     $scope.cpt_bill_description= '' 

    } 






    $scope.cptselect = ""; 
    $scope.cptlist_item= function(){ 
    $scope.list_id= this.$index 
    console.log($scope.list_id) 

    }; 

    $scope.list_id = ''; 


    $scope.removeBill_cpt= function(){ 


    if($scope.list_id == ''){ 

    alert('Please select a list, Thank you'); 

    } 
    else if ($scope.list_id == 0) { 


    $scope.bill_cpt.splice($scope.list_id,1); 
    $scope.list_id = ''; 

    } 
    else{ 

    $scope.bill_cpt.splice($scope.list_id,1); 
    $scope.list_id = ''; 
    } 

    $scope.list_id = ''; 
    } 



}); 

</script> 
</body> 
</html> 

選擇第一個List之後，刪除按鈕不刪除第一個列表。請幫我解決問題。我點擊它來選擇列表。並在按下刪除按鈕後。它被刪除。但它不適用於表的第一個列表。

Answer 1

我猜你設置$scope.list_id = '';爲null，所以它不是設置，直到你選擇的列表，你如果ID是在此基礎上設定只能DELET列表中的第一次運行：

$scope.list_id = ''; 
    $scope.removeBill_cpt= function(){ 

    if($scope.list_id == ''){ 
    alert('Please select a list, Thank you'); 
    } else if ($scope.list_id == 0) { 
    //do the removeing. 
    } 
    }