AngularJS - 選択/オプション付きのNGリピートネストされた、選択した値

Question

は、私は、2 ngのリピートループ、のいずれかを設定するには、ネストされたものをしようとしています設定/取得するには、選択/オプションのドロップダウンです。私は他の同様の投稿をチェックしましたが、選択ボックスでデフォルト値/オプションを取得/設定するためにHTMLでngモデルを定義する方法はまだ分かりません。

<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指令であなたが好きな物件でエイリアスすることができます。詳細なドキュメントはhereです。

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

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

Answer 2

は、私はあなたのようなタグにNG-オプションを使用すべきだと思います

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>

：多分あなたはより多くの説明のためにこれらのドキュメントをお読みください

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

：