comparison app/query-app.component.ts @ 25:0795207f3b90

ng2-table now with pager, sorting and styling.
author casties
date Tue, 26 Jan 2016 19:19:23 +0100
parents f6f4177d0a81
children 991bf349bb04
comparison
equal deleted inserted replaced
24:f6f4177d0a81 25:0795207f3b90
12 import {QueryResultTableComponent} from './query-result-table.component'; 12 import {QueryResultTableComponent} from './query-result-table.component';
13 13
14 @Component({ 14 @Component({
15 selector: 'query-app', 15 selector: 'query-app',
16 template: ` 16 template: `
17 <div class="container">
17 <h1>ISMI-Lab Query Builder</h1> 18 <h1>ISMI-Lab Query Builder</h1>
18 <div>Select a query step:</div> 19 <div>Select a query step:</div>
19 <query-select *ngFor="#step of queryStepList; #i=index;" 20 <query-select *ngFor="#step of queryStepList; #i=index;"
20 [queryStep]="step" [index]="i" 21 [queryStep]="step" [index]="i"
21 (queryChanged)="onQueryChanged($event)"></query-select> 22 (queryChanged)="onQueryChanged($event)"></query-select>
22 <div> 23 <div>
23 <button (click)="addQueryStep()">add step</button> 24 <button (click)="addQueryStep()">add step</button>
24 <button (click)="removeQueryStep()">remove step</button> 25 <button (click)="removeQueryStep()">remove step</button>
25 </div> 26 </div>
26 <query-result-table [queryState]="queryState"></query-result-table> 27 <query-result-table *ngIf="queryState && queryState.results"
28 [queryState]="queryState"
29 [data]="queryState.results" [columns]="queryState.resultColumns">
30 </query-result-table>
31 </div>
27 `, 32 `,
28 directives: [QuerySelectComponent, QueryResultTableComponent], 33 directives: [QuerySelectComponent, QueryResultTableComponent],
29 providers: [QueryService, NormalizationService, HTTP_PROVIDERS] 34 providers: [QueryService, NormalizationService, HTTP_PROVIDERS]
30 }) 35 })
31 36