Question

我有一个Ionic复选框列表，如果我点击一个，我希望取消选中其他复选框。以下是列表的示例：

 <ion-checkbox  ng-model="creditCard" ng-change="p_method()">
            Credit Card
 </ion-checkbox>
 <ion-checkbox  ng-model="cash" ng-change="p_method()">
            Cash
 </ion-checkbox>
 <ion-checkbox  ng-model="check" ng-change="p_method()">
            Check
 </ion-checkbox>

在我的控制器中，我开始写这样的东西：

  function p_method(){
     $scope.creditCard = $scope.creditCard === true ? false : true;
     $scope.cash = $scope.cash === true ? false : true;
     $scope.check = $scope.check === true ? false : true;  
     ...........
    }

编辑：

我可以使用单选按钮，但不能全部取消选择。

Answer 1

最简单的方法是使用复选框的ng-true-value和ng-false-value。这样您就可以直接将选定的付款方式绑定到您的模型。

查看

<ion-checkbox ng-repeat="(key,value) in vm.paymentTypes" ng-model="vm.paymentType" ng-true-value="'{{key}}'" ng-false-value="">{{value}}</ion-checkbox>

<强>控制器

app.controller('MainCtrl', function($scope) { var vm = this; vm.paymentType = 'none'; vm.paymentTypes = { 'creditCard': 'Credit Card', 'cash': 'Cash', 'bankCheque': 'Bank cheque' }; });

<强> Plunker

http://plnkr.co/edit/p6Z5FMxE9vz2NbAlhqrl?p=preview

Answer 2

这就是我解决自己问题的方法：

在视图中：

std::array

这是带有从db：

获取的一些服务数据（docDetails）的控制器

<ion-checkbox  ng-repeat="(key,value) in paymentsMethod" ng-model="value" ng-change="p_change(key)">{{key}}
</ion-checkbox>

Answer 3

您需要在p_method中传递somethign以检测选中了哪个复选框。例如。

ng-change="p_method('creditCard')"

复选框，如Angular和Ionic中的单选按钮

3 个答案: