Javascript ng repeat中的角度多复选框阵列

我试图构建一个简单表单的一部分，它有棱角，但也有一小部分需要努力

表单的一部分有一个“Divisions”部分，其中包含从API调用动态填充的复选框列表。然后，用户可以选择1到7个不同的复选框，以选择表单所属的“部门”

然后，当用户提交表单时，它应该发布JSON，看起来像

Divisions:'div1 div2 div3 div4'

我遇到的问题是由于某种原因，我一次不能选择多个复选框。如果我尝试选择另一个，它将取消选中我选择的第一个

这就是我正在使用的代码

        <label>Divisions Participating*</label>
        <div class="radio-check-wrap">
            <ul class="radio-check-group">
                <li ng-repeat="d in divisions">
                    <input type="checkbox" 
                           ng-model="tradeshow.DivisionLead" 
                           ng-true-value="div{{$index}}" 
                           class="" id="div{{$index}}" 
                           name="div{{$index}}" />
                    <label for="div{{$index}}">{{d.Description}}</label>
                </li>
            </ul>
        </div>

部门参与*


{{d.Description}}

还有一个

$scope.divisions=Api.divisions.query（）和控制器中的
$scope.tradeshow={}

你知道为什么我不能一次选中多个复选框吗
 这似乎是您想要的，一系列复选框都由一个模型支持：
这似乎是您想要的，一系列复选框都由一个型号支持：
您的复选框将所选值存储在同一范围对象上（它们都具有相同的ng模型），因此，当复选框更改时，ng模型将更新以反映新选中的复选框（这将删除上一个复选框中的复选框）

下面的答案向您展示了解决问题的两种方法：

我将对象数组更改为输入数据：

您需要在项目上存储“selected”值，然后计算所选的值。因此，我将您的复选框更改为：

<input type="checkbox" ng-model="d.selected" class="" id="div{{$index}}" name="selectedDivisions[]" />

您的复选框将所选值存储在同一范围对象上（它们都具有相同的ng模型），因此，当复选框更改时，ng模型将更新以反映新选中的复选框（这将删除上一个复选框中的复选框）

下面的答案向您展示了解决问题的两种方法：

我将对象数组更改为输入数据：

您需要在项目上存储“selected”值，然后计算所选的值。因此，我将您的复选框更改为：

<input type="checkbox" ng-model="d.selected" class="" id="div{{$index}}" name="selectedDivisions[]" />

这太棒了，谢谢！然而，我发送回来的JSON的结构似乎需要与预期的不同。它实际上需要是一个对象数组。所以
Divisions:[{Id:2}，{Id:4}，{Id:8}]
你的代码有一点角度的魔力，这让我迷惑不解。你知道我该如何重组它，让它以这种方式吐出来吗？@MikeFisher你是想根据任意Id的出现顺序来设置它们吗？如果Id是division对象的一部分，那么就更容易了，只需更改watch中返回的内容即可。我更新了plunk[link]以显示如何返回Id（或division对象上的任何其他属性）。如果Id在除法对象上，这会容易得多，而不是根据顺序任意计算的值。我将其填充为一个对象数组。但是，我需要使用
$resource（）将此数据作为更大对象的一部分进行发布问题是$scope.selection包含数据。我需要数据住在
$scope.tradeshow.Divisions中
我已经尝试更改
ng模型
，将
选择
重命名为
tradeshow.Divisions
，但我还是被难倒了。我遗漏了什么？@MikeFisher我更新了它，所以它现在正在更新一个tradeshow对象上的分区数组。我还对watch中的return语句进行了更改，以精确地返回您想要的方式（您可以在那里更改return以获取除法的任何属性或整个对象）。希望有帮助！就这样！非常感谢！这太棒了，谢谢！然而，我发送回来的JSON的结构似乎需要与预期的不同。它实际上需要是一个对象数组。所以
Divisions:[{Id:2}，{Id:4}，{Id:8}]
你的代码有一点角度的魔力，这让我迷惑不解。你知道我该如何重组它，让它以这种方式吐出来吗？@MikeFisher你是想根据任意Id的出现顺序来设置它们吗？如果Id是division对象的一部分，那么就更容易了，只需更改watch中返回的内容即可。我更新了plunk[link]以显示如何返回Id（或division对象上的任何其他属性）。如果Id在除法对象上，这会容易得多，而不是根据顺序任意计算的值。我将其填充为一个对象数组。但是，我需要使用
$resource（）将此数据作为更大对象的一部分进行发布问题是$scope.selection包含数据。我需要数据住在
$scope.tradeshow.Divisions中
我已经尝试更改
ng模型
，将
选择
重命名为
tradeshow.Divisions
，但我还是被难倒了。我遗漏了什么？@MikeFisher我更新了它，所以它现在正在更新一个tradeshow对象上的分区数组。我还对watch中的return语句进行了更改，以精确地返回您想要的方式（您可以在那里更改return以获取除法的任何属性或整个对象）。希望有帮助！就这样！非常感谢！可能的重复可能的重复