You need to import the mat-select and the mat-form-field modules into your app.module.ts:
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatSelectModule} from '@angular/material/select';
You also are binding to form controls ([formControl]="columnControl" and [formControl]="databaseControl"), but you have no form controls in your component.
You need to create the form controls in your selection-page.ts:
databaseControl = new FormControl();
columnControl = new FormControl();
UPDATE
I believe you also need to import the reactive forms module too:
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
I managed to replicated your page with no errors with the following app.module.ts file. I left the selection-page.ts and selection-page.html exactly as you have it.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {MatCardModule} from '@angular/material/card';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSelectModule } from '@angular/material/select';
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
FormsModule,
ReactiveFormsModule,
CommonModule,
MatFormFieldModule,
MatSelectModule,
MatCardModule
],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
Working screenshot
If it still doesn't work, I believe that it is not the mat-form-field elements causing your page crash and perhaps something else.
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
