如何使用 AngularJS 填充复选框值列表?
How to populate list of checkbox values with AngularJS?
我正在尝试使用服务器端在 angular js 中构建一个测验应用程序,因为我有两种选择:
- 一题多选
(input-checkbox)
。 "dataType": 3,
- 单一选项
一个问题。
(input-radio)
"dataType": 2,
我正在尝试为多个 checkbox
问题填充存储的答案,在这种情况下 storedAnswer
是一个数组,而 storedAnswer
是 input radio
的整数值
注意: storedAnswer
数组包含 option.questionChoiceValue
的
我的问题是如何填充选中的数组值以进行多项选择 (checkbox
) 问题:
这是我的 HTML 代码:
<div ng-repeat="question in data.questionData">
<span name="multiSelectCheckBox" ng-if="question.dataType == 3">
<div ng-repeat="option in question.choices " class="">
<label for="mul_{{option.questionChoiceValue}}_ques{{option.questionId}}">
<span ng-repeat="stAns in question.storedAnswer"
ng-if="stAns == option.questionChoiceValue">
<input id="mul_{{option.questionChoiceValue}}_ques{{option.questionId}}"
type="checkbox"
ng-model="question.storedAnswer"
ng-change="onSelect(question, option);" />
{{option.questionChoiceText}}
</span>
</label>
</div>
</span>
<span name="multiSelectRadio" ng-if="question.dataType == 2">
<div ng-repeat="option in question.choices " class="">
<label for="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}">
<input type="radio" id="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}"
ng-model="question.storedAnswer"
value="{{option.questionChoiceValue | number}}"
name="que_ques{{option.questionId}}"
ng-change="onSelect(question, option);" />
{{option.questionChoiceText}}
</label>
</div>
</span>
</div>
我有一个这样的对象:
[
{
"marked": "false",
"questionId": "7d00a35ddb6313004f3bdde748961969",
"helpText": "",
"answered": "true",
"storedAnswer": [
1,
5
],
"questionSno": 1,
"dataType": 3,
"choices": [
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 5,
"questionChoiceText": "Float, long double"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 4,
"questionChoiceText": "Float"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 3,
"questionChoiceText": "float, double, long double"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 2,
"questionChoiceText": "long double, short int"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 1,
"questionChoiceText": "short int, double, long int, float"
}
],
"questionText": "In C, what are the various types of real data type (floating point data type)?",
"selected": "false"
},
{
"marked": "false",
"questionId": "93e5c5e5db6713004f3bdde748961957",
"helpText": "",
"answered": "false",
"storedAnswer": 1,
"questionSno": 3,
"dataType": 2,
"choices": [
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 3,
"questionChoiceText": "May be"
},
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 2,
"questionChoiceText": "False"
},
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 1,
"questionChoiceText": "True"
}
],
"questionText": "A macro can execute faster than a function.",
"selected": "false"
}
]
我相信您应该为您的收音机使用 ng-checked 而不是 ng-model。像这样:
<input type="radio" id="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}"
ng-checked="question.storedAnswer"
value="{{option.questionChoiceValue | number}}"
name="que_ques{{option.questionId}}"
ng-change="onSelect(question, option);" />
我正在尝试使用服务器端在 angular js 中构建一个测验应用程序,因为我有两种选择:
- 一题多选
(input-checkbox)
。"dataType": 3,
- 单一选项
一个问题。
(input-radio)
"dataType": 2,
我正在尝试为多个 checkbox
问题填充存储的答案,在这种情况下 storedAnswer
是一个数组,而 storedAnswer
是 input radio
的整数值
注意: storedAnswer
数组包含 option.questionChoiceValue
的
我的问题是如何填充选中的数组值以进行多项选择 (checkbox
) 问题:
这是我的 HTML 代码:
<div ng-repeat="question in data.questionData">
<span name="multiSelectCheckBox" ng-if="question.dataType == 3">
<div ng-repeat="option in question.choices " class="">
<label for="mul_{{option.questionChoiceValue}}_ques{{option.questionId}}">
<span ng-repeat="stAns in question.storedAnswer"
ng-if="stAns == option.questionChoiceValue">
<input id="mul_{{option.questionChoiceValue}}_ques{{option.questionId}}"
type="checkbox"
ng-model="question.storedAnswer"
ng-change="onSelect(question, option);" />
{{option.questionChoiceText}}
</span>
</label>
</div>
</span>
<span name="multiSelectRadio" ng-if="question.dataType == 2">
<div ng-repeat="option in question.choices " class="">
<label for="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}">
<input type="radio" id="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}"
ng-model="question.storedAnswer"
value="{{option.questionChoiceValue | number}}"
name="que_ques{{option.questionId}}"
ng-change="onSelect(question, option);" />
{{option.questionChoiceText}}
</label>
</div>
</span>
</div>
我有一个这样的对象:
[
{
"marked": "false",
"questionId": "7d00a35ddb6313004f3bdde748961969",
"helpText": "",
"answered": "true",
"storedAnswer": [
1,
5
],
"questionSno": 1,
"dataType": 3,
"choices": [
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 5,
"questionChoiceText": "Float, long double"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 4,
"questionChoiceText": "Float"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 3,
"questionChoiceText": "float, double, long double"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 2,
"questionChoiceText": "long double, short int"
},
{
"questionId": "7d00a35ddb6313004f3bdde748961969",
"questionChoiceValue": 1,
"questionChoiceText": "short int, double, long int, float"
}
],
"questionText": "In C, what are the various types of real data type (floating point data type)?",
"selected": "false"
},
{
"marked": "false",
"questionId": "93e5c5e5db6713004f3bdde748961957",
"helpText": "",
"answered": "false",
"storedAnswer": 1,
"questionSno": 3,
"dataType": 2,
"choices": [
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 3,
"questionChoiceText": "May be"
},
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 2,
"questionChoiceText": "False"
},
{
"questionId": "93e5c5e5db6713004f3bdde748961957",
"questionChoiceValue": 1,
"questionChoiceText": "True"
}
],
"questionText": "A macro can execute faster than a function.",
"selected": "false"
}
]
我相信您应该为您的收音机使用 ng-checked 而不是 ng-model。像这样:
<input type="radio" id="sin_{{option.questionChoiceValue}}_ques{{option.questionId}}"
ng-checked="question.storedAnswer"
value="{{option.questionChoiceValue | number}}"
name="que_ques{{option.questionId}}"
ng-change="onSelect(question, option);" />