javascript - angulars jsのng-repeatオプションの配列でサブ値を取得する方法は?

Question

ng-repeat を使用しますが、オプション値を取得できません!

助けてください！html:

<ul ng-controller="app">
    <li ng-repeat="mainlist in mainlists">
    <p>{{mainlist.name}}</p>
    <select ng-options="mainlist.list for mainlist.list in mainlists.list">
      <option value="">{{mainlist.list.name}}</option>
    </select>
  </li>
</ul>

このデモ

js: {{mainlists.name}} を取得するだけで { { mainlists.list.name}}を取得しない

function app($scope) {  
  $scope.mainlists = [
    {
      "name":"main001",
      "list":[
        {
          "no":"1",
          "name":"sub1"
        },{
          "no":"2",
          "name":"sub2"
        }]
     },
   {
      "name":"main002",
      "list":[
        {
          "no":"2-1",
          "name":"sub1"
        },{
          "no":"2-2",
          "name":"sub2"
        }]
     }]
 };

このデモ

Answer 1

ngOptionsディレクティブには、ngModelselect 要素でディレクティブを定義する必要があります。

これは文書化された落とし穴ではありませんが、ソース コードから見ることができます

したがって、次のように追加すると、選択が機能ngModelします。

<select 
  ng-model="mainlist.value" 
  ng-options="item as item.name for item in mainlists.list"
>
</select>

または、select をモデルに接続する予定がない場合 (非常にまれなケース)、ng-repeatselect オプションで使用したい場合があります。

<select>
  <option ng-repeat="item in mainlist.list">{{item.name}}</option>
</select>