我目前正在试验 Angular,我遇到了一个问题,我的 API 中有一组问题,其中一些问题依赖于其他问题,当它是一个单选按钮问题时,将被检查为是,并且在名为ReliesOnID
。
一旦我选择是,依赖于当前被检查的问题需要显示。
我来自 jQuery 背景,所以我会做一个传递 reliesonid
的函数,因为这将是问题编号并执行类似 $('#question' + reliesonid').show()
的操作。
当我单击是重复时,如何使单选按钮显示另一个问题?多年来一直坚持这一点,因此非常感谢帮助。这是我的代码如下:
<div id="question{{question.Number}}" ng-repeat="question in questions" ng-class="question.ReliesOnID == null ? 'here' : 'hidden'">
<div ng-if="question.QuestionTypeID == 3" >
<div class="row">
<div class="col-xs-12">
<h5>{{question.Question}}</h5>
</div>
</div>
<div class="row">
<div class="col-xs-2">
<div class="col-xs-4"></div>
<div class="col-xs-8">
<input type="radio" value="yes" name="{{question.Number}}" /><label>Yes</label>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-2">
<div class="col-xs-4"></div>
<div class="col-xs-8">
<input type="radio" value="no" name="{{question.Number}}" /><label>No</label>
</div>
</div>
</div>
</div>
<div ng-if="question.QuestionTypeID == 1">
<div class="row">
<div class="col-xs-12">
<h5>{{question.Question}}</h5>
</div>
</div>
<div class="row">
<div class="col-xs-4">
<input type="text" class="form-control" />
</div>
</div>
</div>
</div>
编辑 :数据结构是:
{
"Active": true,
"Comments": false,
"DecimalPlaces": 0,
"F": false,
"FP": false,
"Grouped": null,
"ID": 20500,
"Length": false,
"MP": true,
"Multiline": false,
"Number": 45,
"NumericOnly": false,
"Optional": false,
"Question": "How long ago was the treatment?",
"QuestionID": 45,
"QuestionSectionID": 2,
"QuestionTypeID": 2,
"QuestionnaireID": 298,
"ReliesOnAnswer": true,
"ReliesOnID": 44,
"Weight": false
}
最佳答案
您需要使用 ng-model
作为您的答案,例如:<input type="radio" value="yes" ng-model="question.Answer" name="{{question.Number}}"/><label>Yes</label>
然后在那个问题中,您可以有子问题,并且只使用 ng-repeat
。ng-if="question.subQuestions && question.Answer !== undefined" ng-repeat="subquestion in question.subQuestions"
当然,这一切都取决于您的问题结构
编辑
根据您的结构,我会说您的 ng-if
中需要一个 ng-repeat
,它可能是这样的:ng-if="!question.ReliesOnID || wasAnswered(question.ReliesOnID)"
在 wasAnswered
函数中,您需要访问 questions
数组并过滤该 ID 并检查是否已回答并返回 true
或 false