AngularJS-帶有選擇/選項的嵌套ng-repeat，獲取/設置所選值

Question

我正在嘗試設置兩個ng-repeat循環，其中一個是嵌套循環，一個是select / option下拉列表。 我檢查了其他類似的帖子，但是仍然不確定如何在HTML中定義ng-model來在選擇框中獲取/設置默認值/選項。

    <table>
      <tr ng-repeat="student in studentList">
        <td>{{student.name}}</td>
        <td>
          <select ng-model="courseSelected">
            <option ng-repeat="course in courseList" value="{{course.id}}">{{course.name}}</option>
          </select>
        </td>
      </tr>
   </table>

studentList和courseList都來自數據庫表，並且Student表/對象具有courseId列/引用。 換句話說，默認的所選課程和更改的課程選項（如果發生這種情況）將具有其背后的邏輯：student.courseId = course.id

任何幫助表示贊賞。

Answer 1

<select ng-model="student.courseId" ng-options="course.name as course.id for course in courseList">

這應該為您提供所需的東西。 我假設一門課程具有name屬性。 但是您可以使用ng-options指令中您喜歡的任何屬性為課程設置別名。 在這里可以找到更多文檔。

Answer 2

我認為您應該在標記中使用ng-options，例如：

<select ng-model="courseSelected" ng-options= "course.id for course in courseList">

也許您應該閱讀這些文檔以獲取更多說明：

https://docs.angularjs.org/api/ng/directive/ngOptions

https://docs.angularjs.org/api/ng/directive/select

Answer 3

 var editer = angular.module('app', []); function myCtrl($scope) { $scope.studentList = [{ id: 1, name: 'Jack' }, { id: 2, name: 'Terry' }, { id: 3, name: 'Rosa' }, { id: 4, name: 'Holt' }]; $scope.courseList = [{ id: 1, name: 'Course1' }, { id: 2, name: 'Course2' }]; } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" ng-controller="myCtrl" class="container"> <table> <tr ng-repeat="student in studentList"> <td>{{student.name}}</td> <td> <select ng-model="student.courseSelected" ng-options="course as course.name for course in courseList"> </select> </td> <td> {{student.courseSelected.name}} </td> </tr> </table> <label class="item item-input"> <span class="input-label">Select date</span> </label> <pre>{{dateOption}}</pre> </div>