如何使用此 JSON 对象填充多个 select 字段以进行 select 编辑并插入到另一个对象中？

Question

我有一个表单，我想添加多个 select 输入，但我希望 select 输入填充现有的 JSON 对象并允许我 select 这些对象之一，并将其添加到我的表单创建的对象中。

我在此处引用了 AngularJS 文档："Using select with ngOptions and setting a default value" 下的 https://docs.angularjs.org/api/ng/directive/select。但是示例中的 JSON 对象有点不同，我想要做的也是如此。

这是我要加载到多个 select 输入中的 JSON 对象，这样我就可以选择要为我的表单选择的帐户对象：

accounts = [
  {
    "Id": 1,
    "DisplayName": "George",
 },
  {
    "Id": 2,
   "DisplayName": "Bob",
  }
]

这是具有多个 select 输入的表单部分：

<div class="form-group">  
    <label for="audience" class="col-sm-2 control-label">Audience:</label>  
    <div class="col-sm-10 space">      
        <select id="audience" ng-model="newAnnouncement.audience" ng-options="accounts.DisplayName for accounts in newAnnouncement.availableAccounts track by accounts.Id" multiple ></select>
    </div>
</div>

我想对这个输入做的是在多个 select 输入下拉列表中按 Id 的顺序列出 DisplayName，然后当我 select 它们时，它会同时添加 Id 和DisplayName 从帐户对象到我的表单输入对象。我希望从此 select 输入创建的 JSON 对象向我的表单对象添加一个对象，如下所示：

newAnnouncement = [
  {
    "audience": [
      { "Id":"1",  "DisplayName": "George" }
    ]
  }
]

Answer 1

请尝试将 'as' 添加到您的 'ng-options' 中，如下所示：

 <select id="audience" ng-model="newAnnouncement.audience" ng-options="accountsData as accountsData.DisplayName for accountsData in accounts" multiple ></select>

如何使用此 JSON 对象填充多个 select 字段以进行 select 编辑并插入到另一个对象中？

How to populate a multiple select field with this JSON object to be selected and inserted into another object?

javascript

json

angularjs

angularjs-ng-model