複数選択ドロップダウンを作成しようとしています。
ディレクティブを使用して、ng-options基本的に 2 つのデータセットを比較し、一致するオプションを に設定できることがわかりましたselected。
私が持っている2つのコレクションは次のとおりです。
// Full list of possible recipients and the different types
reference = {
"AddressBook": [
{
"ID": 1,
"FullName": "Angela Williams",
"IsActive": true,
"SendType": null,
"Email": "awilliams@yamia.com"
},
{
"ID": 2,
"FullName": "Jerry Schmidt",
"IsActive": true,
"SendType": null,
"Email": "jschmidt@cogibox.mil"
},
{
"ID": 3,
"FullName": "Judy Olson",
"IsActive": true,
"SendType": null,
"Email": "jolson@buzzdog.gov"
},
{
"ID": 4,
"FullName": "Sara Griffin",
"IsActive": true,
"SendType": null,
"Email": "sgriffin@yoveo.org"
}
],
"SendTypes": [
{
"ID": 1,
"Value": "To"
},
{
"ID": 2,
"Value": "CC"
},
{
"ID": 3,
"Value": "BCC"
}
]
}
// Selected recipients
currentNotification.TO = [
{
"Email": "awilliams@yamia.com",
"FullName": "Angela Williams",
"ID": 1,
"IsActive": true,
"SendType": "To"
},
{
"Email": "sgriffin@yoveo.org",
"FullName": "Sara Griffin",
"ID": 4,
"IsActive": true,
"SendType": "To"
}
]
マークアップに使用しようとしたもの:
<div class="form-group" ng-repeat="sendType in reference.SendTypes">
<label for="">{{sendType.Value}}:</label>
<select class="form-control" name="" id="recipients{{sendType}}" ng-multiple="true" multiple ng-model="currentNotification[(sendType.Value).toUpperCase()]" ng-options="recipient.FullName for recipient in reference.AddressBook | orderBy: 'FullName'"></select>
</div>
そのマークアップを使用すると、SendType (To、CC、BCC) ごとに .form-group が作成されます。それぞれに、適切なラベル (sendType.Value) が表示されています。複数選択が表示され、AddressBook のエントリごとにオプションが繰り返されます。また、正しくソートされます。残念ながら何も選択されていません。
について少し調べてng-optionsみると、私のselectedコレクションは、オブジェクトの配列ではなく、文字列の配列である必要があるようです。本当?
奇妙なことに、受信者を手動で選択すると、モデルは次のように更新されます。
BCC = [
{ ... },
{ ... },
{ ... },
{
"ID": 3,
"FullName": "Judy Olson",
"IsActive": true,
"SendType": null,
"Email": "jolson@buzzdog.gov"
}
]
これについて何か助けていただければ幸いです。現在、締め切りに遅れています。誰かフィドルか何かが欲しいなら、私に知らせてください。再度、感謝します!