Commit ffcee140 authored by Vitali Stupin's avatar Vitali Stupin
Browse files

Geting out of observables hell

parent 717c521e
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
......@@ -17,7 +18,8 @@ import { SubsystemItemComponent } from './method-list/subsystem-item/subsystem-i
],
imports: [
BrowserModule,
HttpClientModule
HttpClientModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
......
......@@ -13,11 +13,13 @@ export class MethodListComponent implements OnInit {
constructor(private methodsService: MethodsService) { }
ngOnInit() {
this.getMethods();
// Service will tell when updated data is available!
this.methodsService.subsystemsUpdated.subscribe(signal => {
this.getMethods();
});
}
getMethods(): void {
this.methodsService.getMethods()
.subscribe(subsystems => this.subsystems = subsystems.slice(0, 50));
this.subsystems = this.methodsService.getMethods();
}
}
import { Injectable } from '@angular/core';
import { Injectable, Output, EventEmitter } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { catchError } from 'rxjs/operators';
......@@ -11,25 +11,44 @@ export class MethodsService {
//private apiUrlBase = 'https://www.x-tee.ee/catalogue/EE/wsdls/';
public apiUrlBase = 'http://localhost/';
private limit: number = 15;
private offset: number = 0;
private apiService = 'index.json';
private apiUrl = this.apiUrlBase + this.apiService;
private subsystems: Subsystem[];
private observable: Observable<Subsystem[]>;
@Output() subsystemsUpdated: EventEmitter<any> = new EventEmitter();
constructor(private http: HttpClient) {
this.observable = this.http.get<Subsystem[]>(this.apiUrl)
this.http.get<Subsystem[]>(this.apiUrl)
.pipe(
catchError(this.handleError('getMethods', []))
);
this.observable.subscribe(subsystems => this.subsystems = subsystems);
).subscribe(subsystems => {
this.subsystems = subsystems;
this.signalRefresh();
})
}
private signalRefresh() {
this.subsystemsUpdated.emit(null);
}
private filtered(data: Subsystem[]): Subsystem[] {
return data.slice(this.offset, this.limit);
}
getMethods(): Subsystem[] {
return this.filtered(this.subsystems);
}
getMethods (): Observable<Subsystem[]> {
if (this.subsystems) {
return of(this.subsystems)
filterNonEmpty(checked: boolean) {
console.log(checked)
if (checked) {
this.limit = 5;
} else {
return this.observable;
this.limit = 10;
}
this.signalRefresh();
}
......
......@@ -4,8 +4,9 @@
</div>
<div class="card-body">
<div class="form-group form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Check me out</label>
<input type="checkbox" class="form-check-input" id="exampleCheck1"
[(ngModel)]="nonEmpty" (change)="methodsService.filterNonEmpty(nonEmpty)">
<label class="form-check-label" for="exampleCheck1">Show only nonempty subsystems</label>
</div>
</div>
</div>
......
import { Component, OnInit } from '@angular/core';
import { MethodsService } from '../methods.service';
@Component({
selector: 'app-search',
......@@ -7,7 +8,9 @@ import { Component, OnInit } from '@angular/core';
})
export class SearchComponent implements OnInit {
constructor() { }
nonEmpty: boolean = false
constructor(private methodsService: MethodsService) { }
ngOnInit() {
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment