在Angular Material 7中，我们可以使用DatePicker组件来添加日期选择器。

首先，我们需要先安装Angular Material和Moment.js依赖：

npm install --save @angular/material moment

然后，我们需要将它们添加到我们的NgModule imports中：

import { NgModule } from '@angular/core';
import { MatDatepickerModule, MatInputModule, MatNativeDateModule } from '@angular/material';
import { MatMomentDateModule } from '@angular/material-moment-adapter';

@NgModule({
  imports: [
    MatDatepickerModule,
    MatInputModule,
    MatNativeDateModule,
    MatMomentDateModule
  ],
  exports: [
    MatDatepickerModule,
    MatInputModule,
    MatNativeDateModule,
    MatMomentDateModule
  ]
})
export class MaterialModule { }

接着，我们可以在我们的组件中使用DatePicker组件，如下所示：

import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-date-picker',
  template: `
    
      
      
      
    
  `,
})
export class DatePickerComponent {
  date = new FormControl();
}

在这个例子中，我们使用FormControl来追踪用户所选择的日期。

最后，在模板中，我们使用MatDatePickerToggle指令和MatDatePicker组件来创建日期选择器。

我们还需要使用MatDatepicker属性来链接输入框和日期选择器。

现在我们已经成功添加了一个日期选择器，在用户选择一个日期时，所选日期将被保存到FormControl中。 免责声明：本文内容通过AI工具匹配关键字智能整合而成，仅供参考，火山引擎不对内容的真实、准确或完整作任何形式的承诺。如有任何问题或意见，您可以通过联系service@volcengine.com进行反馈，火山引擎收到您的反馈后将及时答复和处理。