ng-repeat中的下拉列表无法正常工作

Question

我正在研究一个项目，我需要显示与ng-repeat相关的Questionnaries和Answer下拉列表。

当我检查下拉列表时，我正在调用API来获取答案信息，以便在下拉菜单中显示。

当我点击第一个下拉列表时，它会正确打开并显示所有数据。

但是当我在任何下拉列表上第二次点击它时，它将无法正常打开。

任何人都可以帮助我知道这是什么问题。

以下是代码。

<tr ng-repeat="question in questionnaireData track by $index">
<td><span class="" title="{{question.QuestionItem}}">{{question.QuestionItem}}</span></td>
<td>
    <div class="">
        <!--<label for="answers">Select Answer</label>-->
        <select ng-if="question.MasterDataCategoryId != null" id="{{question.QuestionId}}" ng-model="question.MasterData" class="form-control" ng-click="getAnswersDetails(question)">
            <option selected="selected"></option>
            <option ng-repeat="answer in answerData[question.MasterDataCategoryId]" value="{{answer.MasterData}}">{{answer.MasterData}}</option>
        </select> 
        <input ng-if="question.MasterDataCategoryId == null" id="{{question.QuestionId}}" ng-model="question.MasterData" type="text" name="question.QuestionId" class="form-control">
        <!--<span class="help-inline" ng-show="submitted && formVHD.$valid"></span>-->
    </div>
</td>

Answer 1

如果你想创建一个下拉列表，最好使用ng-option然后使用ng-repeat。

<select ng-option="x.data for x in myItems"> 
</select>

因为ng-repeat指令为数组中的每个项重复一段HTML代码，所以它可用于在下拉列表中创建选项，但ng-options指令专门用于填充带有选项的下拉列表，并至少有一个重要的优势：

使用ng-options进行的下拉菜单允许选定的值为对象，而ng-repeat的下拉列表必须是字符串。

此外，您使用了相同的ng-model，id用于选择和输入类型文本我认为这不是一个好主意

<input ng-if="question.MasterDataCategoryId == null" id="{{question.QuestionId}}" ng-model="question.MasterData" type="text" name="question.QuestionId" class="form-control">

<select ng-if="question.MasterDataCategoryId != null" id="{{question.QuestionId}}" ng-model="question.MasterData" class="form-control" ng-click="getAnswersDetails(question)">

在您的情况下，您的选择应如下所示，您应该使用ng-change而不是ng-click。

<select ng-if="question.MasterDataCategoryId != null" id="{{question.QuestionId}}" ng-model="question.MasterData" class="form-control" ng-change="getAnswersDetails(question)" ng-option="answer.MasterData for answer in answerData[question.MasterDataCategoryId]">
        <option selected="selected"></option>
</select>