Ionic - 如何在 Ionic 复选框中获取所选项目
Posted
技术标签:
【中文标题】Ionic - 如何在 Ionic 复选框中获取所选项目【英文标题】：Ionic - How to get selected item in Ionic checkboxes 【发布时间】：2017-06-29 14:41:39 【问题描述】：我想在 Ionic 复选框中选择项目。所以，当用户选中复选框时，我想知道他/她选择了哪本书。
这是我的代码 sn-ps：
<ion-item ng-repeat="book in data.books">
<div style="margin-left:110px;margin-right:10px;">
book.name
</div>
<li class="item item-checkbox checkbox-balanced">
<label class="checkbox">
<input type="checkbox">
</label>
</li>
</ion-item>
运行代码时，如下所示：
我想使用 ng-model 但我不知道如何使用它。有人可以帮助我，因为我是 Ionic 和 AngularJS 的新手，谢谢！
更新： 非常抱歉我没有提供控制器的代码 sn-p，代码如下：
.controller('DetailsCtrl', function ($scope, $http)
$http.get("") // some webservice url
.then(function (response)
$scope.data = response.data;
);
);
【问题讨论】：
【参考方案1】：您可以在每个值中为 checked 设置一个变量，并将其作为 model 变量绑定到复选框
DEMO
var clubApp = angular.module('clubApp', ['ionic'])
clubApp.controller('ctrlPlayer', ['$scope', function($scope)
$scope.books = [
"name": "And the goog news is",
"checked": false
,
"name": "Girl on the train",
"checked": false
];
$scope.getselected = function()
angular.forEach($scope.books,function(key,value)
if(key.checked ==true)
alert(key.name);
);
]);<!DOCTYPE html>
<html ng-app='clubApp'>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" type="text/css" href="//code.ionicframework.com/1.0.0-beta.11/css/ionic.min.css">
<script src="//code.ionicframework.com/1.0.0-beta.9/js/ionic.bundle.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="ctrlPlayer">
<ion-list>
<ion-checkbox ng-model=value.checked ng-repeat="(key, value) in books">
<span>value.name</span>
</ion-checkbox>
</ion-list>
<button ng-click="getselected()" class="button button-positive">
get selected
</button>
<h1>selectedval</h1>
</body>
</html>【讨论】：
您好，谢谢您的回答。非常抱歉我没有提供控制器的代码。这是我的错。我很抱歉。我已经用标签“更新”更新了这个问题。你能看看吗？谢谢Sajeetharan以上是关于Ionic - 如何在 Ionic 复选框中获取所选项目的主要内容，如果未能解决你的问题，请参考以下文章