ng-checkedに固着しました

Question

ユーザーがチェックボックスをクリックすると、数量が0のng-repeatのすべての商品が表示されます。チェックボックスがオフでない場合は、すべてのアイテムが表示されます。現在、私は機能の半分を得ることができました。

チェックボックス：

<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" ng-checked="vm.OnHandQty()"> 

表

<tr ng-repeat="item in vm.items | filter :search">           
     <td ng-bind="item.itemNo"> </td> 
     <td ng-bind="item.description"></td> 
     <td ng-bind="(item.listPrice | currency)"></td> 
     <td ng-bind="item.onHandQty" ng-model="quantity"></td> 
    </tr> 

コントローラ

vm.OnHandQty = function() {    
    $scope.search = {}; 

    vm.items.forEach(i => { 
     if (i.onHandQty == 2) { 
      console.log(i); 
      $scope.search = i; 
      return true; 
     } 
     else { 
      $scope.search =i; 
      return false; 
     } 
    }); 
} 

Answer 1

私はあなたのチェックボックスとコントローラの実装を変更することを提案します：

チェックボックス

<input type="checkbox" ng-model="vm.checked" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch"> 

は - ここでは、我々は代わりに "NG-確認" と「vm.checkedの "NG-モデル" を使用"は、チェックボックスのngモデルとして定義する変数です。

コントローラ

$scope.search = function(item) { 
    return ($scope.vm.checked) ? item.onHandQuantity === 0: true; 
}; 

- ここでは、我々はあなたがあなたのテーブルで使用している「NGリピート」フィルタを定義します。

Answer 2

は、代わりにこれを試してみてください：

<tr ng-repeat="item in vm.items" ng-show="onoffswitch==true && item.onHandQty != 0? false : true"> 
    <td ng-bind="item.itemNo"> </td> 
    <td ng-bind="item.description"></td> 
    <td ng-bind="(item.listPrice | currency)"></td> 
    <td ng-bind="item.onHandQty" ng-model="quantity"></td> 
</tr> 

これはonoffswitchが真で、onHandQtyがゼロの場合にのみ行を表示し、それ以外の場合は行を表示します。したがって、onoffswitchが真でonHandQtyがゼロでない場合、行は非表示になります。

Answer 3

あなたはNG-変更とNG-モデルを利用することができます。

<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" ng-model="vm.checked" ng-change="checkBoxChange(vm.checked)"> 

次に、あなたからcheckBoxChange機能は、ビジネスロジックを適用します。

vm.checkBoxChange = function(checked){ 
    if(checked){ 
     //Do something 
    }else{ 
    //Something else 
    } 
};