Как заполнить поле множественного выбора этим объектом JSON, который будет выбран и вставлен в другой объект? - PullRequest
0 голосов
/ 26 декабря 2018

У меня есть форма, в которую я хочу добавить вход множественного выбора, но я хочу, чтобы вход выбора был заполнен существующим объектом JSON и позволил мне выбрать один из этих объектов и добавить его в объект, созданный моей формой.

Я ссылаюсь на документы AngularJS здесь: https://docs.angularjs.org/api/ng/directive/select в разделе «Использование select с ngOptions и установка значения по умолчанию».Но объект JSON в этом примере немного отличается и поэтому я пытаюсь это сделать.

Вот мой объект JSON, который я хочу загрузить во вход множественного выбора, чтобы я мог выбрать, какой объект учетных записей я хочу выбрать для своей формы:

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

Это частьформа, которая имеет вход множественного выбора:

<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>    

То, что я хотел бы сделать для этого ввода, перечислить DisplayName в порядке идентификатора в выпадающем списке множественного выбора, затем, когда я выбираю их, он добавляети Id и DisplayName от объекта учетных записей до моего объекта ввода формы.Я хочу, чтобы объект JSON, созданный из этого входного элемента выбора, добавил объект в мой объект формы, который выглядит следующим образом:

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

1 Ответ

0 голосов
/ 26 декабря 2018

Пожалуйста, попробуйте добавить 'as' в ваши 'ng-options', например:

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