0

我正在尝试创建一个多步表单，第 2 步是一堆复选框。这是带有复选框的表单：

<form ng-submit="createSubCategory(formData)">
    <div ng-repeat="sub_category in event_sub_categories">
        <ion-checkbox ng-model="formData.sub_category" ng-true-value="'{{sub_category}}'">
          {{sub_category}}</ion-checkbox>
    </div>
    <button type="submit" class="button button-block button-positive">Continue</button>
</form>

复选框 ( event_sub_categories) 的数据是从服务器中提取的。我需要将用户选择的输入保存到 formData。formData 正在多步骤表单的每个页面上收集，并将在所有表单页面之后通过 post 请求提交。我是 Angular 的新手，我对复选框的工作方式有些困惑。

问题 1：我了解 ng-model 如何与普通文本字段一起工作。但我不确定我是否了解它如何与复选框一起使用。ng-model 是否替换了 html 名称元素？意思是，当我使用 将其提交到服务器时$resource，数据的键是由 ng-model 设置的吗？

问题 2：我如何命名 ng-model 以便它是 formData 的一部分，但它也与sub_category从数据库中提取的名称相关。问题是使用上面的代码，在任何给定时间只能选择一个复选框，我希望用户能够在给定时间检查许多复选框。如果无法做到这一点，我怎样才能通过复选框获得我需要的功能？

4

1 回答 1

0

为了能够一次选择多个复选框，您需要一个对象（角度）来保存所有值。我已经在自己的应用程序中实现了这段代码，并且发现接收它的函数很容易解释对象。（迭代对象检查真/假值）

这是您的<ion-checkbox>代码：

<ion-checkbox ng-repeat="sub_category in event_sub_categories" ng-model="formData[sub_category]">

这将为单击的每个复选框设置subcategory: true/false在formData对象内部。

然后你需要做的就是把那个formData对象发送到任何地方，就像你以前做的那样。这是一个代码笔，它显示了复选框的变化、更新formData的对象和formData字符串化的对象。

http://codepen.io/anon/pen/LNdaev?editors=1010

作为一个例子，我已经创建了我自己的价值观event_sub_categories，所以当然这些会与你自己的不同

如果您有任何问题，请发表评论。

于 2016-04-15T01:26:51.660 回答