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 }