Angular Material 5元素未正确呈现

Question

我在使用Angular Material我的应用时遇到了一些问题。在应用程序的一个页面上它呈现正常，但在另一个子模块中它没有。 （所以，是的，我已经导入了材料css）我认为它与我的导入的导入顺序有关，但我不确定。我无法在任何掠夺者中重现它：/

我使用的两个元素及其问题：

1. 按钮：看起来不错，但颜色=＆＃34;主要＆＃34;不适用颜色
2. 输入字段：看起来不错，但占位符不会浮动
3. 我尝试在同一个组件中添加一个MatDatePicker，但它也没有用。
4. 应用程序中的所有其他元素都可以正常工作

HTML：

  <form [formGroup]="form" (ngSubmit)="onRegistration()">
    <mat-form-field>
      <input matInput 
             placeholder="Username">
    </mat-form-field>
    <mat-form-field>
      <input matInput placeholder="Password">
    </mat-form-field>
    <button mat-raised-button color="primary">Submit</button>
  </form>

这是我的共享模块：

  imports: [
    CommonModule,
    BrowserAnimationsModule,
    MaterialComponentsModule,
    AppRoutingModule
  ],
  declarations: [NavbarComponent, FooterComponent],
  exports: [
    CommonModule,
    BrowserAnimationsModule,
    MaterialComponentsModule,
    NavbarComponent,
    FooterComponent,
    FormsModule,
    AppRoutingModule,
    ReactiveFormsModule,
    HttpModule,
    HttpClientModule,
    JwtModule
  ],

这是我的材料组件模块：

  imports: [
  ],
  exports: [
    MatInputModule,
    MatFormFieldModule,
    MatMenuModule,
    MatIconModule,
    MatCardModule,
    MatDialogModule,
    MatProgressSpinnerModule,
    MatTabsModule,
    MatExpansionModule,
    MatDatepickerModule,
    MatSnackBarModule,
    MatButtonModule
  ],

我试图改变MatInputModule / MatFormFieldModule的顺序。在我的功能模块中，我只导入SharedModule

imports[SharedModule]