首页 > 解决方案 > 当我使用 Angular Material 日期选择器时,我的页面停止显示

问题描述

在我的角度项目中添加角度材料包后,我使用波纹管代码来使用日期选择器。但是当我使用任何 HTML 页面的日期选择器代码时,它会隐藏我的总页面。我是角度方面的新手,所以我不熟悉这种类型的角度行为。
account.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RegisterComponent } from './register/register.component';
import { LoginComponent } from './login/login.component';
import { AccountRoutingModule } from './account-routing.module';
import { ReactiveFormsModule } from '@angular/forms';
import { TestAccountComponent } from './test-account/test-account.component';
import { FogetPasswordComponent } from './foget-password/foget-password.component';
import { ResetPasswordComponent } from './reset-password/reset-password.component';
import { MatDatepickerModule } from '@angular/material/datepicker';
import {MatFormFieldModule} from '@angular/material/form-field';

@NgModule({
  declarations: [
    RegisterComponent,
    LoginComponent,
    TestAccountComponent,
    FogetPasswordComponent,
    ResetPasswordComponent
  ],
  imports: [
    CommonModule,
    AccountRoutingModule,
    ReactiveFormsModule,
    MatDatepickerModule,
    MatFormFieldModule
  ],
  exports: [
    ReactiveFormsModule
  ]
})
export class AccountModule { }

组件.html

    <div><mat-form-field class="example-full-width" appearance="fill">
    <mat-label>Choose a date</mat-label>
    <input matInput [matDatepicker]="picker">
    <mat-datepicker-toggle matSuffix [for]="picker">
      <mat-icon matDatepickerToggleIcon>keyboard_arrow_down</mat-icon>
    </mat-datepicker-toggle>
    <mat-datepicker #picker></mat-datepicker>
  </mat-form-field>
</div>

我是角度的新手。我无法确定为什么此代码会隐藏我的页面?

标签: angularangular-material

解决方案


您是否导入了 MatIconModule ?因为您在垫子表单字段中使用垫子图标

如果不

从“@angular/material/icon”导入 {MatIconModule};

进口:[.......,MatIconModule]


推荐阅读