在Angular 8中,可以使用@angular/material
库中的MatDatepicker
组件来创建日期选择器。以下是一个使用MatDatepicker
的日期时间选择器指令的解决方法的代码示例:
@angular/material
库。如果没有安装,请运行以下命令进行安装:npm install @angular/material@8.0.0
app.module.ts
)中导入所需的模块,并将它们添加到imports
数组中:import { MatInputModule, MatDatepickerModule, MatNativeDateModule } from '@angular/material';
@NgModule({
imports: [
MatInputModule,
MatDatepickerModule,
MatNativeDateModule
],
...
})
export class AppModule { }
app.component.html
)中添加日期时间选择器的输入框和按钮:
app.component.ts
)中导入MatDatepicker
类:import { MatDatepicker } from '@angular/material';
selectedDate: Date;
onDateChange(selectedDate: Date) {
this.selectedDate = selectedDate;
console.log(selectedDate); // 在控制台中打印所选的日期
}
ngModel
指令将所选日期与组件类中的变量绑定:
现在,您已经创建了一个使用MatDatepicker
组件的日期时间选择器指令。当用户选择一个日期时,selectedDate
变量将被更新,并且在控制台中打印所选的日期。您可以根据自己的需求进一步自定义和调整这个日期时间选择器。