Angular2 Observables refers to the proposed standard for managing async data that was included in the release of ES7. Observables are used by the TypeScript-based open-source web application framework Angular as an interface to handle multiple types of common async operations, such as with EventEmitter, HTTP, and AJAX requests and responses. Use this tag for questions related to the use of Observables in the second version of the Angular framework.
Questions tagged [angular2-observables]
839 questions
318
votes
4 answers
angular2 style guide - property with dollar sign?
Parent and children communicate via a service example from the official guide on Angular.io makes use of dollar signs in Observable stream names.
Notice missionAnnounced$ and missionConfirmed$ in the following example:
import { Injectable } from…
gerasalus
- 7,538
- 6
- 44
- 66
252
votes
8 answers
Subject vs BehaviorSubject vs ReplaySubject in Angular
I've been looking to understand those 3:
Subject
BehaviorSubject
ReplaySubject
I would like to use them and know when and why, what are the benefits of using them and although I've read the documentation, watched tutorials and searched google I've…
user6015054
238
votes
6 answers
take(1) vs first()
I found a few implementation of AuthGuards that use take(1). In my project, I used first().
Do both work the same way?
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/first';
import { Observable } from 'rxjs/Observable';
import {…
Calvin Ferrando
- 3,794
- 3
- 16
- 26
148
votes
17 answers
The pipe 'async' could not be found
I am trying to build a simple blog with Angular 2 and Firebase and I am having issues using async pipe in a component. I get the error in the console.
zone.js:344Unhandled Promise rejection: Template parse errors:
The pipe 'async' could not be…
Balaji
- 1,687
- 2
- 11
- 10
90
votes
3 answers
Best way to import Observable from rxjs
In my angular 2 app I have a service that uses the Observable class from the rxjs library.
import { Observable } from 'rxjs';
At the moment I am just using Observable so that I can use the toPromise() function.
I read in another StackOverflow…
Danoram
- 8,132
- 12
- 51
- 71
68
votes
5 answers
How to pass observable value to @Input() Angular 4
I am new to angular and I have the following situation which is I have a service getAnswers():Observable[]>and two components that are related to each other.
online-quote
dynamic-form
online-quote component calls the service…
AlejoDev
- 4,345
- 9
- 36
- 67
68
votes
4 answers
angular - using async pipe on observable
Hi I have a observable user$ with a lot of properties (name, title, address...)
component{
user$:Observerable;
constructor(private userService:UserService){
this.user$ = this.userService.someMethodReturningObservable$()
}
}
Is there…
Han Che
- 8,239
- 19
- 70
- 116
67
votes
4 answers
Testing error case with observables in services
Let's say I have a component that subscribes to a service function:
export class Component {
...
ngOnInit() {
this.service.doStuff().subscribe(
(data: IData) => {
doThings(data);
},
…
user3656550
- 758
- 1
- 5
- 8
49
votes
5 answers
Observable from
What's the preferred way to create an observable from a button's onclick event using Angular 2?
I'm not sure if it's considered best practice to grab the native element from the DOM in the component code (how do I do this?), or if there's some other…
GBa
- 17,509
- 15
- 49
- 67
44
votes
3 answers
Why handle errors with catchError and not in the subscribe error callback in Angular
So I'd normally write my http requests like this
Service
getData() {
return this.http.get('url')
}
Component
getTheData() {
this.service.getData().subscribe(
(res) => {
//Do something
},
(err) => {
console.log('getData…
Munerz
- 1,052
- 1
- 13
- 26
33
votes
8 answers
How use async service into angular httpClient interceptor
Using Angular 4.3.1 and HttpClient, I need to modify the request and response by async service into the HttpInterceptor of httpClient,
Example for modifying the request:
export class UseAsyncServiceInterceptor implements HttpInterceptor {
…
Pasquale Vitale
- 569
- 1
- 6
- 15
32
votes
6 answers
Angular2. How can I check if an observable is completed?
In my page there is a button that generates a report. That report needs data that is loaded using a http call to a rest endpoint when the page is loaded, but I do not have a guarantee that they are loaded when the user presses the report button.
How…
Cosmin D
- 639
- 1
- 11
- 24
29
votes
4 answers
How to make nested Observable calls in Angular2
I am having some troubles making nested Observable calls. By that I mean a call to a http service that retrieve a user, then getting the id from the user to make another http call, and finally render the results on screen.
1) HTTP GET 1 : get the…
nuvio
- 2,555
- 4
- 32
- 58
27
votes
4 answers
Angular2/4 : Refresh Data Realtime
I need to refresh the data in a component page in an interval. Also I need to refresh the data after doing some action. I am using Obeservables in the service so that I can subscribe to when the response is ready. I am pushing the subscriptions to a…
Jithin
- 2,594
- 1
- 22
- 42
24
votes
1 answer
How to mock a observable stream while testing angular2 components?
I am writing test cases for angular2 components.
I had created a service which uses observable stream as below:
import {Injectable} from '@angular/core'
import {Subject} from 'rxjs/Subject';
import {User} from…
Bhushan Gadekar
- 13,485
- 21
- 82
- 131