Блог

Я использую выпадающий список primeng Multiselect в форме.

При нажатии на кнопку редактирования я хочу отобразить существующие данные во всех полях. для ввода текста он отображается так, как я использую [(ngModel)], и я пробовал то же самое для выпадающего списка Multiselect, но он не работает.

поэтому я не могу привязать значения выпадающего списка multiselect. Я пробовал использовать цикл for, но значения не поступают в поле.

       <div *ngFor ="let role of resource.roles;">
        {{role.name}}
        <p-multiSelect
        [options]="resourceRoles | dropdownToValuePipe"
        placeholder="Select"
        name = "roles"
        id="roles"
        [(ngModel)]="role.name"
        ngModel
        required
        appendTo="body"
      >
      </p-multiSelect>
      </div>
 

С вашим текущим кодом вы создаете один multiselect для каждой роли, которую имеет ресурс / пользователь. Я предполагаю, что это не то, что вы хотите, иначе вы, вероятно, просто использовали бы обычный выпадающий список.

Итак, если вам действительно нужен только один multiselect, вы бы сделали что-то вроде этого:

   <p-multiSelect
    [options]="resourceRoles"
    optionLabel="name"
    placeholder="Select"
    name="roles"
    id="roles"
    [(ngModel)]="resource.roles"
    required
    appendTo="body"
  >
  </p-multiSelect>
 

Я не был уверен, что делает канал, возможно, он вам не понадобится, если вы используете optionLabel . Я также удалил дубликат ngModel .

Возможно, вы захотите также поиграть с использованием dataKey="roleId" , если объекты в resource.roles не совпадают с объектами in resourceRoles . Это соответствовало бы выборкам на основе roleId вместо использования равенства объектов