Mercurial > hg > ng2-query-ismi
comparison app/query-select.component.ts @ 1:59b7c3afcc6b
first interface and http request.
author | Robert Casties <casties@mpiwg-berlin.mpg.de> |
---|---|
date | Mon, 11 Jan 2016 19:25:53 +0100 |
parents | 39ec75917ef7 |
children | c741a00d38de |
comparison
equal
deleted
inserted
replaced
0:39ec75917ef7 | 1:59b7c3afcc6b |
---|---|
1 import {Component} from 'angular2/core'; | 1 import {Component, OnInit} from 'angular2/core'; |
2 import {HTTP_PROVIDERS} from 'angular2/http'; | |
3 | |
4 import {QueryService} from './query.service'; | |
5 import {QueryMode} from './query-mode'; | |
6 | |
2 | 7 |
3 @Component({ | 8 @Component({ |
4 selector: 'query-select', | 9 selector: 'query-select', |
5 template: ` | 10 template: ` |
6 <p>Selected option: {{selectedQuery}}</p> | 11 <p>Selected option: {{selectedQuery}}</p> |
7 <select (change)="onSelectType($event)"> | 12 <select (change)="onSelectType($event)"> |
8 <option *ngFor="#option of queryTypes" [value]="option"> | 13 <option *ngFor="#mode of queryModes" [value]="mode.id"> |
14 {{mode.label}} | |
15 </option> | |
16 </select> | |
17 <select [(ngModel)]="selectedQuery"> | |
18 <option *ngFor="#option of query2Options" [value]="option"> | |
9 {{option}} | 19 {{option}} |
10 </option> | 20 </option> |
11 </select> | 21 </select> |
12 <select [(ngModel)]="selectedQuery"> | 22 `, |
13 <option *ngFor="#option of query2Types" [value]="option"> | 23 providers: [QueryService, HTTP_PROVIDERS] |
14 {{option}} | |
15 </option> | |
16 </select> | |
17 ` | |
18 }) | 24 }) |
19 export class QuerySelectComponent { | 25 |
20 public queryTypes = ['Object type is', 'Attribute contains']; | 26 export class QuerySelectComponent implements OnInit { |
27 public queryModes; | |
21 public selectedQuery = 'unknown'; | 28 public selectedQuery = 'unknown'; |
22 public query2Types = ['a', 'b', 'c']; | 29 public query2Options; |
30 | |
31 constructor(private _queryService: QueryService) {} | |
32 | |
33 ngOnInit() { | |
34 this.setupQueryModes(); | |
35 } | |
36 | |
37 setupQueryModes() { | |
38 this.queryModes = this._queryService.getQueryModes(); | |
39 this._queryService.getIsmiObjectTypes(); | |
40 } | |
23 | 41 |
24 onSelectType(event: any) { | 42 onSelectType(event: any) { |
25 var selected = event.target.value | 43 var selected = event.target.value; |
26 this.selectedQuery = selected; | 44 this._queryService.getQueryOptions(selected).then( |
27 if (selected == 'Attribute contains') { | 45 options => this.query2Options = options); |
28 this.query2Types = ['d', 'e', 'f']; | |
29 } | |
30 } | 46 } |
31 } | 47 } |