comparison src/app/query-app.component.ts @ 47:b65a031c4967 ng2-final

first step to angular2-final (2.4) version of the query browser.
author casties
date Fri, 17 Mar 2017 20:16:52 +0100
parents app/query-app.component.ts@dc4f0541f04d
children f8d6f8479e77
comparison
equal deleted inserted replaced
46:1f3fed01aef6 47:b65a031c4967
1 import {Component} from '@angular/core';
2 //import {HTTP_PROVIDERS} from '@angular/http';
3
4 import {QueryState} from './query-state';
5 import {QueryStep} from './query-step';
6
7 import {QueryService} from './query.service';
8 import {NormalizationService} from './normalization.service';
9
10 import {QuerySelectComponent} from './query-select.component';
11 //import {QueryResultComponent} from './query-result.component';
12 import {QueryResultTableComponent} from './query-result-table.component';
13
14 @Component({
15 selector: 'query-app',
16 template: `
17 <div class="container">
18 <h1>ISMI-Lab Query Builder</h1>
19 </div>
20 <div class="container">
21 <div>Select a query step:</div>
22 <query-select *ngFor="let step of queryStepList; let i=index;"
23 [queryStep]="step" [index]="i"
24 (queryChanged)="onQueryChanged($event)"></query-select>
25 <div>
26 <button (click)="addQueryStep()">add step</button>
27 <button (click)="removeQueryStep()">remove step</button>
28 </div>
29 </div>
30 <div class="container">
31 <query-result *ngIf="queryState?.results"
32 [resultInfo]="queryState.resultInfo"
33 [queryState]="queryState">
34 </query-result>
35 </div>
36 `,
37 //directives: [QuerySelectComponent, QueryResultTableComponent],
38 //providers: [QueryService, NormalizationService, HTTP_PROVIDERS]
39 })
40
41 export class QueryAppComponent {
42 public queryState: QueryState;
43 public queryStepList: string[];
44
45 constructor(private _queryService: QueryService) {
46 this._queryService.setup();
47 this.queryStepList = [];
48 this.addQueryStep();
49 }
50
51 addQueryStep() {
52 this.queryStepList.push('step');
53 }
54
55 removeQueryStep() {
56 this.queryStepList.pop();
57 this._queryService.state.steps.pop();
58 }
59
60 onQueryChanged(event: any) {
61 console.debug("app.onquerychanged! event=", event);
62 this._queryService.runQuery();
63 this.queryState = this._queryService.getState();
64 }
65 }