Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
X-tee
X-Road-catalogue
Commits
ffcee140
Commit
ffcee140
authored
Feb 22, 2019
by
Vitali Stupin
Browse files
Geting out of observables hell
parent
717c521e
Changes
5
Hide whitespace changes
Inline
Side-by-side
src/app/app.module.ts
View file @
ffcee140
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
]
...
...
src/app/method-list/method-list.component.ts
View file @
ffcee140
...
...
@@ -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
();
}
}
src/app/methods.service.ts
View file @
ffcee140
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
();
}
...
...
src/app/search/search.component.html
View file @
ffcee140
...
...
@@ -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>
...
...
src/app/search/search.component.ts
View file @
ffcee140
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
()
{
}
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment