0

I am using angular material native select and getting error: mat-form-field must contain a matformfieldcontrol

HTML :

<mat-form-field>
     <select matNativeControl formControlName="xyz" required>
             <option [value]="a">A</option>
             <option [value]="a">B</option>
             <option [value]="a">C</option>
     </select>
</mat-form-field>

I have imported MatFormFieldModule, MatInputModule, MatSelectModule, MatOptionModule, modules in my app.module.ts

app.module.ts :

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { MatFormFieldModule, MatInputModule, MatSelectModule, MatOptionModule } from '@angular/material';

@NgModule({
imports: [
    CommonModule,
    ReactiveFormsModule,
    FormsModule,
    MatFormFieldModule,
    MatInputModule,
    MatSelectModule,
    MatOptionModule
  ],
})

I have used <input> as well in the same form and that is working fine. But getting this particular error only in <select> .

Could not find any solution for it.

shaktimaan
  • 1,769
  • 13
  • 14
Janet
  • 7
  • 4
  • Does this answer your question? [mat-form-field must contain a MatFormFieldControl](https://stackoverflow.com/questions/46705101/mat-form-field-must-contain-a-matformfieldcontrol) – Aref Ben Lazrek Oct 30 '19 at 04:29
  • No, It does not. – Janet Oct 30 '19 at 04:34
  • 1
    Can you please specify version of angular material you are using. I tried your code in stackblitz(https://stackblitz.com/edit/sa-xbn5hq-hqhkhs) and its working fine. – shaktimaan Oct 30 '19 at 04:37

1 Answers1

0

You need to use mat-select and mat-option tags here

<mat-form-field>
    <mat-select matNativeControl formControlName="xyz">
        <mat-option value="a">A</mat-option>
        <mat-option value="b">B</mat-option>
    </mat-select>
</mat-form-field>

and input works fine because we right it as

<input type="text" matInput formControlName="carrierName" placeholder="CarrierName">
MaBbKhawaja
  • 842
  • 10
  • 16