无法使用Angular和Firebase制作mat-chip-list选择列表

时间:2017-11-16 19:54:21

标签: angular list firebase angular-material

我知道我的帖子接近这个问题:Incorrect behaviour when selecting chips in Angular Material

但是我仍然有一些困难让它适用于我的案例。

我有一个类型的mat-chip-list选择,我在表单中用来在firebase中创建产品。在提交表单时,我不确定如何检索所选mat-chip的所有信息。

来自模板:

<form #newProductForm="ngForm" (ngSubmit)="onSubmit(newProductForm)">           <mat-form-field>
    <input matInput placeholder="Title" 
        required ngModel #newTitle="ngModel" name="newTitle">
</mat-form-field>                   
<mat-chip-list ngModel #selectedTypes name="selectedTypes"
    *ngIf="types | async; let types" [multiple]="true">
    <mat-chip *ngFor="let types of types"
        [selectable]="true"
        [color]="primaryIfSelected"
        [value]="type"
        (click)="selectType(type)">
        {{ type.title }}
    </mat-chip>
</mat-chip-list>            
<button mat-fab type="submit" color="accent">
    <mat-icon>save</mat-icon>
</button>           

来自product-component.ts

this.types = this.productService.getTypeList();

onSubmit(newProductForm: NgForm) {
console.log(newProductForm) // newTitle="blabla" but selectedTypes="" }

0 个答案:

没有答案