Question

我根据angular.js中的产品选择，通过json从数据库中提取了一个选项列表

以下是示例代码：

<ion-checkbox ng-repeat="extra in extras" ng-model="order.extras" checklist-value="{{ extra.id }}"><strong>{{ extra.name }}</strong></ion-checkbox>

我希望用户能够选择多个额外内容，但似乎无法绑定这些选项。

Answer 1

我认为它可以与ng-model="order.extras[extra.id]"一起使用，然后您可以在order.extras中跟踪已检查的附加内容。

请查看下面的演示或jsfiddle。

＆＃13;

angular.module('demoApp', ['ionic'])
	.controller('mainController', mainController);
    
function mainController($scope) {
	$scope.order = {};
	$scope.extras = [
    	{
        id: 0,
        name: 'first'
        },
        {
        id: 1,
        name: 'second'
        },
        {
        id: 2,
        name: 'third'
        }
    ]
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/css/ionic.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/js/ionic-angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/js/ionic.bundle.js"></script>
<div ng-app="demoApp" ng-controller="mainController">
<ion-content>
    <ion-checkbox ng-repeat="extra in extras" ng-model="order.extras[extra.id]" checklist-value="{{ extra.id }}"><strong>{{ extra.name }}</strong></ion-checkbox>
    
current order: {{order}}
    
</ion-content>
</div>

＆＃13;

在angular.js中绑定动态复选框

1 个答案: