在Angular 2中,可以使用Angular Material来创建一个表格,并且使用日期列来混合字符串。以下是一个示例代码:
npm install @angular/material moment
import { MatInputModule } from '@angular/material/input';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MomentDateModule } from '@angular/material-moment-adapter';
并将它们添加到@NgModule的imports数组中:
imports: [
BrowserModule,
BrowserAnimationsModule,
MatInputModule,
MatDatepickerModule,
MatNativeDateModule,
MomentDateModule
]
Date
{{ element.date | date: 'yyyy-MM-dd' }}
import { Component } from '@angular/core';
import { MatTableDataSource } from '@angular/material';
@Component({
selector: 'app-table',
templateUrl: './table.component.html',
styleUrls: ['./table.component.css']
})
export class TableComponent {
displayedColumns = ['date'];
data = new MatTableDataSource([
{ date: new Date() },
{ date: new Date() },
{ date: new Date() }
]);
}
这样就创建了一个带有日期列的Angular Material表格,并将日期对象转换为字符串进行显示。