我正在n集成角材料的Angular项目5.2.5: 这是我的app.component.ts:
import { Component } from '@angular/core';
import {MatTableDataSource} from '@angular/material';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
displayedColumns = ['position', 'firstName', 'lastName', 'email'];
dataSource = new MatTableDataSource(ELEMENT_DATA);
}
export interface Element {
position: number;
firstName: string;
lastName: string;
email: string;
}
const ELEMENT_DATA: Element[] = [
{position: 1, firstName: 'John', lastName: 'Doe', email: 'john@gmail.com'},
{position: 1, firstName: 'Mike', lastName: 'Hussey', email: 'mike@gmail.com'},
{position: 1, firstName: 'Ricky', lastName: 'Hans', email: 'ricky@gmail.com'},
{position: 1, firstName: 'Martin', lastName: 'Kos', email: 'martin@gmail.com'},
{position: 1, firstName: 'Tom', lastName: 'Paisa', email: 'tom@gmail.com'}
];
这是我的app.component.html:
<mat-table #table [dataSource]="dataSource">
<ng-container matColumnDef="position" >
<mat-header-cell *matHeaderCellDef> No. </mat-header-cell>
<mat-cell *matCellDef="let element">{{element.position}}</mat-cell>
</ng-container>
<ng-container matColumnDef="firstName">
<mat-header-cell *matHeaderCellDef> First Name </mat-header-cell>
<mat-cell *matCellDef="let element">{{element.firstName}}</mat-cell>
</ng-container>
<ng-container matColumnDef="lastName">
<mat-header-cell *matHeaderCellDef> Last Name </mat-header-cell>
<mat-cell *matCellDef="let element">{{element.lastName}}<mat-cell>
</ng-container>
<ng-container matColumnDef="email">
<mat-header-cell *matHeaderCellDef> Email </mat-header-cell>
<mat-cell *matCellDef="let element">{{element.email}}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
有什么需要的吗?
答案 0 :(得分:2)
上述问题是您尚未在 dis=data.disasters.url
alt.Chart(dis).mark_bar().encode(
x=alt.X('year(Year):T'),
y=alt.Y('Deaths:Q'),
color='Entity:N'
)
之后关闭 <mat-cell>
。这是更正的代码,
注意:您可以在Visual Studio代码上使用自动套用格式,以查看缺少的结束标记。
{{element.lastName}}