chore: add cdk table to universal app (#6300)

* Adds the CDK table to the universal app. This ensures that CDK tables can be rendered inside of platform-server.
This commit is contained in:
Paul Gschwendtner
2017-08-07 19:20:47 +02:00
committed by mmalerba
parent 3944d70435
commit 49d6080b09
2 changed files with 37 additions and 2 deletions
@@ -227,3 +227,15 @@
This is the content text that makes sense here.
<md-action-row>Action</md-action-row>
</md-expansion-panel>
<h2>CDK Table</h2>
<cdk-table #table [dataSource]="cdkTableDataSource">
<ng-container cdkColumnDef="userId">
<cdk-header-cell *cdkHeaderCellDef>ID</cdk-header-cell>
<cdk-cell *cdkCellDef="let row">{{row.userId}}</cdk-cell>
</ng-container>
<cdk-header-row *cdkHeaderRowDef="cdkTableColumns" ></cdk-header-row>
<cdk-row *cdkRowDef="let row; columns: cdkTableColumns;"></cdk-row>
</cdk-table>
+25 -2
View File
@@ -1,6 +1,7 @@
import {Component, NgModule} from '@angular/core';
import {ServerModule} from '@angular/platform-server';
import {BrowserModule} from '@angular/platform-browser';
import {Observable} from 'rxjs/Observable';
import {
MdAutocompleteModule,
MdButtonModule,
@@ -29,14 +30,33 @@ import {
MdToolbarModule,
MdTooltipModule,
} from '@angular/material';
import {
CdkTableModule,
DataSource
} from '@angular/cdk/table';
import 'rxjs/add/observable/of';
@Component({
selector: 'kitchen-sink',
templateUrl: './kitchen-sink.html',
styleUrls: ['./kitchen-sink.css'],
})
export class KitchenSink { }
export class KitchenSink {
/** List of columns for the CDK table. */
cdkTableColumns = ['userId'];
/** Data source for the CDK table. */
cdkTableDataSource: DataSource<any> = {
connect: () => Observable.of([
{ userId: 1 },
{ userId: 2 }
]),
disconnect: () => {}
};
}
@NgModule({
@@ -70,7 +90,10 @@ export class KitchenSink { }
MdTabsModule,
MdToolbarModule,
MdTooltipModule,
MdExpansionModule
MdExpansionModule,
// CDK Modules
CdkTableModule
],
bootstrap: [KitchenSink],
declarations: [KitchenSink],