Question

我正在尝试创建一个多选下拉列表。

我看到我可以使用ng-options指令基本比较两个数据集，将任何匹配选项设置为selected。

以下是我拥有的两个系列：

// 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"
  }
]

真的很感激任何帮助。这让我拖延了截止日期。如果有人想要小提琴或其他什么，请告诉我。再次感谢！

我的数据结构是否归咎于多个选择下拉列表在Angular中不起作用？

0 个答案: