• • 场景：我使用来自ng-matero**的指令作为DateTime，并使用Angular Material作为应用程序的总体设计。总体而言，功能运行良好。但是，Angular Material主题无法应用于dateTimepicker元素，如
    
    所示
• • 代码**我的app. module. ts文件如下所示

import { HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { MaterialModule } from './material.module';
import { SearchComponent } from './components/search/search.component';
import { JourneysListComponent } from './components/journeys-list/journeys-list.component';
import { FlexLayoutModule } from '@angular/flex-layout';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MtxDatetimepickerModule } from '@ng-matero/extensions/datetimepicker';
import { MtxNativeDatetimeModule } from '@ng-matero/extensions/core';

@NgModule({
  declarations: [
    AppComponent,
    SearchComponent,
    JourneysListComponent,
    
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    HttpClientModule,
    MaterialModule,
    FlexLayoutModule,
    BrowserAnimationsModule,
    MtxDatetimepickerModule,
    MtxNativeDatetimeModule
    
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

• • 超文本标记语言**

<div class="login-wrapper" fxLayout="row" fxLayoutAlign="center center">
    <mat-card class="box">
      <mat-card-header>
        <mat-card-title>Planner</mat-card-title>
      </mat-card-header>
      <form class="example-form">
        <mat-card-content>
          <mat-form-field class="example-full-width">
            <input matInput placeholder="Origin" matInput required>
          </mat-form-field>
          <mat-form-field class="example-full-width">
            <input matInput placeholder="Destination" matInput required>
          </mat-form-field>
          <mat-form-field class="example-full-width">
            <mat-placeholder>Date & Time</mat-placeholder>
            <mtx-datetimepicker #datetimePicker
                                [type]="type"
                                [mode]="mode"
                                [multiYearSelector]="multiYearSelector"
                                [startView]="startView"
                                [twelvehour]="twelvehour"
                                [timeInterval]="timeInterval"
                                [touchUi]="touchUi"
                                [timeInput]="timeInput"></mtx-datetimepicker>
            <input [mtxDatetimepicker]="datetimePicker" [formControl]="datetime" matInput required>
            <mtx-datetimepicker-toggle [for]="datetimePicker" matSuffix></mtx-datetimepicker-toggle>
          </mat-form-field> 
        </mat-card-content>
        <button mat-stroked-button color="accent" class="btn-block">Search</button>
      </form>
    </mat-card>
  </div>

• • 技术支助**

import { Component, OnInit } from '@angular/core';
import {MtxCalendarView,MtxDatetimepickerMode,MtxDatetimepickerType} from '@ng-matero/extensions/datetimepicker';
import { MTX_DATETIME_FORMATS } from '@ng-matero/extensions/core';
import { UntypedFormControl } from '@angular/forms';

@Component({
  selector: 'app-search',
  templateUrl: './search.component.html',
  styleUrls: ['./search.component.scss'],
  providers: [
    {
      provide: MTX_DATETIME_FORMATS,
      useValue: {
        parse: {
          dateInput: 'YYYY-MM-DD',
          monthInput: 'MMMM',
          yearInput: 'YYYY',
          timeInput: 'HH:mm',
          datetimeInput: 'YYYY-MM-DD HH:mm',
        },
        display: {
          dateInput: 'YYYY-MM-DD',
          monthInput: 'MMMM',
          yearInput: 'YYYY',
          timeInput: 'HH:mm',
          datetimeInput: 'YYYY-MM-DD HH:mm',
          monthYearLabel: 'YYYY MMMM',
          dateA11yLabel: 'LL',
          monthYearA11yLabel: 'MMMM YYYY',
          popupHeaderDateLabel: 'MMM DD, ddd',
        },
      },
    },
  ],
})
export class SearchComponent implements OnInit {

  type: MtxDatetimepickerType = 'datetime';
  mode: MtxDatetimepickerMode = 'auto';
  startView: MtxCalendarView = 'month';
  multiYearSelector = false;
  touchUi = false;
  twelvehour = false;
  timeInterval = 1;
  timeInput = true;

  datetime = new UntypedFormControl();
  constructor() { }

  ngOnInit(): void {
  }

}

• • 问题**

我是否需要为mtx-datetimepicker专门设置主题？如果是，我该如何做？