Angular 角材料不在角9中工作

我在Angular 9中使用了Angular材质，但它不适合我。它正在编译和运行，但每次我在HTML中使用角度材质（如mat复选框或mat表单字段）时，它都无法正常工作。我甚至尝试直接从material.angular.io复制代码，但它仍然不起作用

我圈出了我想做的那个。我的结果是这样的：

代码是相同的，只是我使用了不同的占位符和标签，并且没有使用mat提示功能。我已经在app.module.ts中正确导入了模块，所以我不知道出了什么问题。这是我使用的代码

<div class="false" *ngIf="!authorized">
      <h4>In order to complete the sign up process, we need the authorized person from your organization <br>to review our terms and conditions. You can send them an email below.</h4>
      <br>
            <mat-form-field appearance="fill">
              <mat-label>Authorized Person's Name</mat-label>
              <input matInput placeholder="Authorized Person's Name">
              <mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
            </mat-form-field>
      <br>
      <button mat-button class="email">Send Email</button>
</div>

在你的app.module.ts中

然后在您的component.ts中

---

结果证明答案很简单。我只需要更新几个依赖项。希望这个答案对以后忘记这样做的人有所帮助。

是否导入所需的模块？能否将app.module代码粘贴到此处以检查出了什么问题？是的，我相信我导入了正确的模块。我刚刚粘贴了代码。你在chrome开发工具控制台中有错误吗？没有，只是警告它们是什么以及你是如何找到它们的。我在命令提示符中使用了ng update，它给了我一个列表。我记不起他们对什么感到抱歉。

import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { FlexLayoutModule } from '@angular/flex-layout';
import { MatCardModule } from '@angular/material/card';
import  { MatCheckboxModule } from '@angular/material/checkbox';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { MatRadioModule } from '@angular/material/radio';
import { PortalComponent } from './portal/portal.component';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field'
import { FormsModule } from '@angular/forms';

@NgModule({
  declarations: [
    AppComponent,
    PortalComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    FlexLayoutModule,
    MatCardModule,
    MatCheckboxModule,
    MatRadioModule,
    MatButtonModule,
    FormsModule,
    MatFormFieldModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

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

<div class="false" *ngIf="!authorized">
  <h4>In order to complete the sign up process, we need the authorized person from your organization <br>to review our terms and conditions. You can send them an email below.</h4>
  <p>
    <mat-form-field appearance="fill">
      <mat-label>Authorized Person's Name</mat-label>
      <input matInput placeholder="Authorized Person's Name">
      <mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
    </mat-form-field>
  </p>
  <button mat-button class="email">Send Email</button>
</div>