在ng-repeat中填充另一个onchange事件的下拉列表

Question

如何实现这一目标？

上面的网格是使用ng-repeat

生成的

我想在选择特定行上的主题时，它会填充同一行上的教师下拉列表。

教师XML：

<ArrayOfTeacherToSubject xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.datacontract.org/2004/07/DTO">
<TeacherToSubject>
<ClassName i:nil="true"/>
<ClassToClassArmId i:nil="true"/>
<ModifiedBy i:nil="true"/>
<ModifiedOn i:nil="true"/>
<SchoolId>0</SchoolId>
<StaffId>20</StaffId>
<StaffName>David Jumma</StaffName>
<SubjectId>4</SubjectId>
<SubjectName i:nil="true"/>
<TeacherToSubjectId i:nil="true"/>
</TeacherToSubject>
<TeacherToSubject>
<ClassName i:nil="true"/>
<ClassToClassArmId i:nil="true"/>
<ModifiedBy i:nil="true"/>
<ModifiedOn i:nil="true"/>
<SchoolId>0</SchoolId>
<StaffId>20</StaffId>
<StaffName>David Jumma</StaffName>
<SubjectId>6</SubjectId>
<SubjectName i:nil="true"/>
<TeacherToSubjectId i:nil="true"/>
</TeacherToSubject>
<TeacherToSubject>
<ClassName i:nil="true"/>
<ClassToClassArmId i:nil="true"/>
<ModifiedBy i:nil="true"/>
<ModifiedOn i:nil="true"/>
<SchoolId>0</SchoolId>
<StaffId>20</StaffId>
<StaffName>David Jumma</StaffName>
<SubjectId>3</SubjectId>
<SubjectName i:nil="true"/>
<TeacherToSubjectId i:nil="true"/>
</TeacherToSubject>
</ArrayOfTeacherToSubject>

Answer 1

ng-repeat为每次迭代创建一个新范围，因此您可以使用两个控件在相同范围内选择教师的事实。

我假设你想要老师选择这样的东西：

teacher.key as teacher.name for teacher in teachers[subject.id]

Answer 2

1）为每一行创建一个隔离范围的指令。

2）绑定你的主题选择＆＃34;范围项ng-model="subjectSelected"

3）在指令控制器内，为此模型添加一个手表

$scope.$watch('subjectSelected', function(newVal, oldVal){
    //
});

4）在上一个函数中，为对象$scope.options

指定一个新数组

5）对于视图的绑定，您可以使用指令ng-options

<select ng-model="$parent.contactTypeHomeHost" ng-options="option.id as option.label for option in options"></select>