Question

我看过其他问题，但都没有结果。

<mat-form-field>
  <mat-select matInput placeholder="Favorite food">
    <mat-option *ngFor="let food of foods" [value]="food.value">
      {{food.viewValue}}
    </mat-option>
  </mat-select>
</mat-form-field>

基本选择器。我在浏览器中运行时收到此错误。

如果“ mat-option”是Angular组件，并且具有“ value”输入，则请验证它是否属于此模块。
如果'mat-option'是Web组件，则将'CUSTOM_ELEMENTS_SCHEMA'添加到该组件的'@ NgModule.schemas'中，以消除这种情况

环顾四周，我已经导入了所需的api。

import { MatFormFieldModule } from '@angular/material/form-field';
import {MatSelectModule} from '@angular/material/select'

我也有很多其他Mat导入

import {
 MatInputModule,
 MatMenuModule,
 MatCardModule,
 MatButtonModule,
 MatIconModule,
 MatToolbarModule,
MatExpansionModule,
} from '@angular/material';

但是我仍然遇到错误。应用在常规输入（例如：

    <mat-form-field>
  <mat-label>Address</mat-label>
  <input placeholder="eg 221B Baker Street" type="text" 
   name="Address" ngModel required minlength="5" #title="ngModel">
</mat-form-field>

花了一天的时间，这是我无法解决问题的地方。任何帮助将不胜感激。下班前我将无法答复。再次感谢！

编辑：添加到整个app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { PostDetailsComponent } from './post-details/post-    details.component';
import { PostService } from './services/post.service';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router';

import { FormsModule } from "@angular/forms";
import {
  MatInputModule,
  MatMenuModule,
  MatCardModule,
  MatButtonModule,
  MatIconModule,
  MatToolbarModule,
  MatExpansionModule,
} from '@angular/material';
import { MatFormFieldModule } from '@angular/material';
import {MatSelectModule} from '@angular/material'
import { PostCreateComponent } from './post-create/post-create.component';
import { PostEditComponent } from './post-edit/post-edit.component';
import { PostSigninComponent } from './post-signin/post-signin.component';
import { MembershipTypesComponent } from './membership-types/membership-    types.component';

const appRoutes: Routes = [
  {
    path: 'list',
    component: PostDetailsComponent
  },
  {
    path: 'create',
    component: PostCreateComponent
  },
  {
    path: 'edit/:id',
    component: PostEditComponent
  },
  {
    path: 'membershipTypes',
    component: MembershipTypesComponent
  }
];


@NgModule({
  declarations: [
    AppComponent,
    PostDetailsComponent,
    PostCreateComponent,
    PostEditComponent,
    PostSigninComponent,
    MembershipTypesComponent
  ],
  imports: [
   RouterModule.forRoot(appRoutes),
    BrowserModule,
    FormsModule,
    HttpClientModule,
    MatIconModule,
    MatButtonModule,
    BrowserAnimationsModule,
    MatInputModule,
    MatFormFieldModule,
    MatCardModule,
    MatButtonModule,
    MatToolbarModule,
    MatExpansionModule,
    MatMenuModule,
  ],
  providers: [PostService],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

您以错误的方式导入MatSelectModule，请尝试：

import {MatSelectModule} from '@angular/material'

Answer 2

您需要将MatSelectModule添加到imports数组中，如下所示：

imports: [
    RouterModule.forRoot(appRoutes),
    BrowserModule,
    FormsModule,
    HttpClientModule,
    MatIconModule,
    MatButtonModule,
    BrowserAnimationsModule,
    MatInputModule,
    MatFormFieldModule,
    MatCardModule,
    MatButtonModule,
    MatToolbarModule,
    MatExpansionModule,
    MatMenuModule,
    MatSelectModule
  ],

<mat-form-field>的错误。正常输入工作正常，但不能使用错误的垫选功能

2 个答案: