通过ng-repeat, ng-model和复选框获取数组中的位置

Get position in array with ng-repeat, ng-model and checkbox

本文关键字:数组 位置 获取 复选框 ng-repeat ng-model 通过      更新时间:2023-09-26

我必须问我的用户一系列问题并记录他们的回答。问题和可能答案的类型/数量是多种多样的,所以我试图以一种捕获所有问题类型的方式编写我的代码。两个示例问题是:

你更喜欢什么规模的组织?答案选项:1-10、11-50、51-200、201-500、501-1,000、1,001-5,000、5,001-10,000、10,000+

你喜欢什么样的着装要求?回答选项:休闲、商务休闲、正式

我需要向两个不同的用户询问相同的问题,并将他们的回答相互比较以确定匹配百分比。由于答案是不同的,我想匹配所选答案数组中的位置。这样,我就可以在视图中动态地构建答案选项,并对所有问题使用相同的匹配算法。user1 answerArray[1,3,5]和user2 answerArray[2,3,5]答案3匹配,因此给一分。另外,user1 answerArray[false, false, true, true, true, true, true, true, false, true]和user2 answerArray[true, true, true, false, false]他们都选择了答案3,所以给一分。

我目前的方法是尝试使用ng-repeat为每个答案创建一个复选框,但我不确定如何确定哪个复选框被选中。我尝试使用索引来获取重复循环中的位置,但它不起作用,我不知道如何处理将其传递到我的提交函数。

form.form-horizontal(ng-submit='answer(not sure what to do with params here)')
    div.form-group(ng-repeat='answer in questionData.answers')
        label.col-xs-3 {{answer}}:
            input(type='checkbox' ng-model='index' ng-change='checked(true, false)')

我读过一些关于ng-repeat和ng-model结合的其他答案,我可以使数组成为对象数组,然后将ng-model设置为对象属性。这似乎是不必要的数据转换。我很乐意听到其他的解决方案。

页面看起来像这样:

<div ng-view="" class="ng-scope">
    <div class="ng-binding ng-scope">What size organization do you prefer?</div>
    <form ng-submit="answerswer(1,2,3,4,5,6,7,8)" class="form-horizontal ng-pristine ng-valid ng-scope"><!-- ngRepeat: answer in questionData.answers -->
        <div ng-repeat="answerswer in questionData.answers" class="form-group ng-scope">
            <label class="col-xs-3 ng-binding">1-10:
                <input type="checkbox" ng-model="$index" ng-change="checked(true, false)" class="ng-pristine ng-untouched ng-valid"></label>

可以使用$index访问当前项在循环中的位置。因此,您可以将模型值指定为answerArray[$index],以便您将获得结果数组

input(type='checkbox' ng-model='answerArray[$index]' ng-change='checked(true, false)')

ng-repeat$index而来。例如:

 <li ng-repeat="page in pages">
            <a ng-class="{ testClass: $index == pageNumber }" ng-click="setPageNumber($index)">{{ page }}</a>
 </li>