2016-11-19 4 views
2

Как правильно построить FormBuilder на нескольких нескольких? Он работает только без кратного.Угловой 2 FormBuilder с выбором нескольких

Я попытался использовать FormArray, FormGroupName в HTML, однако, все возвращающие ошибки. И примеры, с которыми я сталкиваюсь, всегда не помечены <select multiple>.

Не могли бы вы мне помочь? Спасибо.

.TS

this.detailFormGroup = this.fb.group({ 
    "id": [this.item.id], 
    "name": [this.item.name, [Validators.required]], 
    "categories": this.item.categories 
}); 

.HTML

<form [formGroup]="detailFormGroup"> 
    <div> 
     <input type="text" formControlName="name" /> 
    </div> 
    <div> 
     <select formControlName="categories" multiple> 
     <option *ngFor="let item of categories" [value]="item.id">{{ item.categoryName }}</option> 
     </select> 
    </div> 
</form> 

Что мне нужно, что когда я получаю detailFormGroup.value я получаю объект:

{ 
    id: 1, 
    name: "name 1", 
    categories: [ 
     { 
      id: 5, 
      categoryName: "name 5" 
     }, 
     { 
      id: 10, 
      categoryName: "name 10" 
     } 
    ] 
} 

И, конечно, когда я устанавливаю объект item, элементы управления HTML также выбираются вместе с их элементами.

Я получаю не так, как это:

{ 
    id: 1, 
    name: "name 1", 
    categories: [ 5, 10 ] 
} 

ответ

3

Вы получаете массив выбранных значений. И в вашем HTML мы можем видеть option [value]="item.id".

Просто измените это на option [value]="item".