我正在整理以下测验，它从 json 中提取并提供问题选项等。
<div ng-repeat="question in module.questions | filter:{'number':module.path.subsection}" class="questionContainer {{question.class}}">
<p ng-bind-html="question.title"></p>
<label ng-repeat="answer in question.answers">
<input type="radio"
name="{{ question.title }}"
value="answer"
ng-model="qCtrl.selectedAnswers[question.title]">
<div class="question-box">{{ answer.answerLabel }}</div>
<!--<div class="{{ quizModel }}" ng-click="seeModel(module, section, subsection, question, quizModel)"></div>-->
<div class="clearBoth"></div>
</label>
</div>
<button ng-click="validate()">Submit</button><br />
<p ng-if='qCtrl.totalQuestions'>{{ correctAnswers }}/{{ totalQuestions }} were correct.</p>
</div>
我有这个 Controller :
.controller('QuizCtrl',
function() {
var ctrl = this;
this.selectedAnswers = {};
this.questions = [{
'title': 'Question 1 ?',
'answers': [{
'title': 'Answer 1',
'correct': false,
}, {
'title': 'Answer 2',
'correct': true,
}]
}, {
'title': 'Question 2 ?',
'answers': [{
'title': 'Answer 1',
'correct': false,
}, {
'title': 'Answer 2',
'correct': true,
}]
}]
this.validate = function() {
ctrl.correctAnswers = 0;
ctrl.totalQuestions = ctrl.questions.length;
for (var answer in ctrl.selectedAnswers) {
answerObj = ctrl.selectedAnswers[answer]
if (answerObj.correct) {
ctrl.correctAnswers += 1;
}
}
}
});
问题是，在与比我更擅长 Angular 的人讨论过这个问题后，问题似乎出在功能上，而不是从相同的范围或类似的东西中提取出来。另外，我真的无法使用硬编码数组来提取问题。我已经有一个 Json 了。如何使验证函数真正与问题中选定的值对话？!
Json结构如下:
sections: [
subSections:[
"questions":[
"title":"a",
"number":"b",
"name":"c",
"answers":[
{
"answerKey": "true",
"answerLabel": "true"
},
{
"answerKey": "false",
"answerLabel": "false"
}
]
]
]
]
最佳答案
请参阅下面的演示，这应该会对您有所帮助。
var app = angular.module('app', []);
app.controller('firstCtrl', function($scope) {
var vm = this;
vm.answears = [];
vm.questions = [{
'id': '1',
'title': 'Question 1 ?',
'answers': [{
'title': 'Answer 1',
'correct': false,
}, {
'title': 'Answer 2',
'correct': true,
}]
}, {
'id': '2',
'title': 'Question 2 ?',
'answers': [{
'title': 'Answer 1',
'correct': false,
}, {
'title': 'Answer 2',
'correct': true,
}]
}];
vm.validate = function() {
vm.correctAnswers = 0;
vm.totalQuestions = vm.questions.length;
angular.forEach(vm.answears, function(correct) {
if (correct) {
vm.correctAnswers++;
}
})
}
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
<div ng-controller="firstCtrl as vm">
<div ng-repeat="question in vm.questions" ng-init="index= $index">
<p>{{question.title}}</p>
<div ng-repeat="answer in question.answers">
<label>{{ answer.title }}
<input type="radio" name="{{question.title}}" ng-value="answer.correct" ng-model="vm.answears[index]" />
</label>
</div>
</div>
<button ng-click="vm.validate()">Submit</button>
<br /> <pre>{{vm.qCtrl}}</pre>
<p ng-show="vm.totalQuestions">{{ vm.correctAnswers }}/{{ vm.totalQuestions }} were correct.</p>
</div>
</body>关于javascript - 在 Angular 中将范围链接在一起，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29287626/