2017-12-12 7 views
0

私が試しても、IDは常に値として渡されます。私は、Genre.label(文字列)を値として使用したいと考えています...ng-optionsは、文書化されているように、正常に動作しませんか?

私はng-optionsの周りに頭を抱えようとしています。私はドキュメントを読んでいますが、例はまっすぐに見えますが、期待される。

ブックのための私のモデルは

Book: { 
    title: string, 
    genre: string, 
    description: string 
} 

であると私は私のスコープにジャンルを引っ張ってng-init="getGenres()"を使用する場合ジャンルのための私のモデルは、私が使用して期待して、その後

Genre: { 
    label: string 
    description: string 
} 

ある

ng-options="genre.label for genre in genres track by genre.label" 

は、繰り返しごとにLABELを使用し、オプション値にLABELと実際のところ - 要素がそれを示してい点検 - それは次のようになります。

<option label="Sci-fi" value="Sci-fi">Sci-fi</option> 

私のデータは、しかし、このように見える終わる:ここ

_id : 5a2f...5691 
genre : "5a2f552765226c3018be9878" 
title : "Blah Blah" 

フォームはコンテキストにある:

<form ng-submit="addBook()" ng-init="getGenres()" > 
    <div class="form-group" > 
     <label>Title</label> 
     <input type="text" class="form-control" ng-model="book.title" placeholder="Title" > 
    </div> 
    <div class="form-group" > 
     <label>Genre</label> 
     <select class="form-control" ng-model="book.genre" 
       ng-options="genre.label for genre in genres track by genre.label" > 
      <option value="">-- choose genre --</option> 
     </select> 
    </div> 
</form> 

// get genres 
$scope.getGenres = function() { 
    $http.get('/api/genres') 
    .success(function(response) { 
     $scope.genres = response; 
    }); 
} 
:ここ

はCOLTROLLERsのgetGenresです

それが返されます。

[{ 
    "_id": "5a2f5.....a065b", 
    "label": "Sci-fi", 
    "description": "Dealing with subject matter that combines fictional worlds and science, both real and theoretical." 
}, { 
    "_id": "5a2f5.....9877", 
    "label": "Romance", 
    "description": "Topics with amorous overtone, undertones and toneless rantings. Matters of the heart. Emotional folly and frolic." 
}, { 
    "_id": "5a2f5.....9878", 
    "label": "Suspense", 
    "description": "Events dealing with an arousal of anticipation and dread, mostly in equal parts." 
}, { 
    "_id": "5a2f5.....9879", 
    "label": "Gobbeldegook", 
    "description": "nonsensical gibberish. blather, post-moderistic drivel." 
}, { 
    "_id": "5a2f5.....987a", 
    "label": "Drama", 
    "description": "Drama Drama Drama Drama Drama Drama Drama" 
}, { 
    "_id": "5a2f5.....987b", 
    "label": "NonFiction", 
    "description": "Real life crap. No fakery or literary license, this is REAL!" 
}] 

すべてのヘルプは非常にあなたがこのように使用する必要があります -cheers

答えて

1

評価されて:あなたはgenre.label asを使用しない場合

<select class="form-control" ng-model="book.genre" 
      ng-options="genre.label as genre.label for genre in genres track by genre.label" > 
     <option value="">-- choose genre --</option> 
    </select> 

を、ジャンルが使用されますこの場合のモデルとして。
式BEFORE asgenre.label)がモデル値として使用されます。
asの後の式はgenre.labelで、オプションの表示値として使用されます。

+0

Oi!完璧な、今私は尋ねることが嫌いですが、どうすれば '編集'を見て、別のQを投稿するのでしょうか? – jpmyob

+0

実際には... "by track by genre.label"を削除すると、私の編集の問題が修正されました。ドキュメントの注意として、 "as"と "by by"を1つの式で使用するよう注意してください。おかげさまで再びMavlarn – jpmyob

関連する問題