我一直在使用Angularjs的项目中工作,现在将相同的代码转换为angular 6。
我陷入了根据问题ID分配值来选择选项的问题。
我在Angularjs中使用的代码:
HTML
<tr ng-repeat="question in questionnaireDataObject[categoryUnique.id] track by $index">
<td><span class="" title="{{question.QuestionItem}}">{{question.QuestionItem}}</span></td>
<td>
<div class="" >
<select id="{{question.QuestionId}}" ng-model="question.MasterData" ng-change="getSelectedAnsVal(question);" class="form-control" style="white-space:pre-wrap;">
<option selected="selected"></option>
<option ng-repeat="answer in answerData[question.MasterDataCategoryId]" value="{{answer.MasterData}}">{{answer.MasterData}}</option>
</select>
</div>
</td>
JS
$scope.getAnswersDetails = function(questionId){
questBasedEditService.getAnswerDetails(questionId)
.then(function (data, status, headers, config) {
$scope.answerData[questionId] = data.data.selectResults;
}, function (error) {
});
}
我有一套手风琴,对于每个问题我们都有一套问题,我有与特定问题相关的不同答案,这些问题是我通过设置问题ID在angularjs中实现的。答案API的调用将与我们拥有的问题数量一样多。请参考以下
我无法在角度6中执行相同的操作。
角度6代码:
HTML:
<tr *ngFor="let question of questionnaireDataObject;" >
<td><span class="" title="{{question.QuestionItem}}">{{question.QuestionItem}}</span></td>
<td class="selectstyle select-text-align">
<select *ngIf="question.MasterDataCategoryId != 0" id="{{question.QuestionId}}" [(ngModel)]="question.MasterData" (change)="getSelectedAnsVal(question);" style="white-space:pre-wrap;">
<option selected="selected"></option>
<option *ngFor="let answer of answerData" value="{{answer.MasterData}}">{{answer.MasterData}}</option>
</select>
JS
1)我们有2个API调用。一种是调用问题数据,另一种是调用答案数据。
2)如果手风琴中有5个问题,我将分别使用 questionID 调用Answer API 5次。
getAnswersDetails(questionId): void {
this.records = this.QuestionnaireAdd.getAnswerDetails(questionId).subscribe((data: any) => {
this.answerData = data.selectResults;
},
error => {
},
() => {
})
}
有人可以建议我如何解决此问题。