Questions tagged [angular-observable]

239 questions
1582
votes
30 answers

What is the difference between Promises and Observables?

What is the difference between Promise and Observable in Angular? An example on each would be helpful in understanding both the cases. In what scenario can we use each case?
Rohit
  • 15,907
  • 3
  • 8
  • 9
63
votes
3 answers

Could not use Observable.of in RxJs 6 and Angular 6

import { Observable, of } from "rxjs"; // And if I try to return like this return Observable.of(this.purposes); I am getting an error stating, Property 'of' does not exist on type 'typeof Observable'
k harish
  • 1,553
  • 2
  • 13
  • 24
59
votes
5 answers

why should we use subscribe() over map() in Angular?

I am trying to take advantage of observables in angular2 and got confused on why should i use map() over subscribe(). Suppose i am getting values from a webApi, like this this.http.get('http://172.17.40.41:8089/api/Master/GetAllCountry') Now…
Lijin Durairaj
  • 2,791
  • 9
  • 25
  • 48
40
votes
5 answers

Angular 6 RXJS Import Syntax?

I'm migrating an Angular 5 app to the latest CLI and Angular 6 RC and all of my Observable imports are broken. I see that Angular 6 changes the way the imports work, but I can't find any definite reference as to how the syntax works. I had this in 5…
Rick Strahl
  • 15,839
  • 13
  • 83
  • 121
23
votes
3 answers

Putting two async subscriptions in one Angular *ngIf statement

I have the following in my component template:
Sammy
  • 2,087
  • 2
  • 28
  • 66
23
votes
2 answers

How does HTTP error-handling work with observables?

I see a lot of tutorials doing something like this: http.get("...").subscribe( success => console.log('hello success'), error => console.log('bye error') ); I don't know how this works, since there aren't any types or anything, however I tried…
codepleb
  • 8,529
  • 10
  • 50
  • 93
22
votes
3 answers

Why Angular uses Observable for HttpClient?

As per https://angular.io/tutorial/toh-pt6 In general, an observable can return multiple values over time. An observable from HttpClient always emits a single value and then completes, never to emit again. Which is indeed true, Http…
Namit
  • 231
  • 2
  • 6
21
votes
1 answer

Detect Click outside element in angular 4 using directives

I have used a custom directive to detect click outside an element in angular 2 but the same is not possible in angular 4. [plunkr] https://plnkr.co/edit/aKcZVQ?p=info When I try using the same code in angular-4 I get the following errors: 1.…
21
votes
2 answers

Subscribe is not a function error

I am trying to subscribe to an observable from a service, it builds without error but I get the error "this.service.getBanners(...).subscribe is not a function" when viewing in the browser. Service: import { Injectable } from '@angular/core'; import…
Steve
  • 4,086
  • 2
  • 13
  • 21
19
votes
8 answers

Angular 6: Property 'catch' does not exist on type 'Observable'?

I am upgrading my app to Angular 6. I am upgrading from Angular 4, but the code below is causing errors in Angular 6, where it worked fine in Angular 4. The errors I am getting: Property 'of' does not exist on type 'typeof Observable' Error:…
Shubham Verma
  • 6,252
  • 5
  • 46
  • 71
7
votes
2 answers

Angular5 HttpInterceptor depending on the result of an Observable

I am trying to implement using Angular5 an HttpInterceptor to inject an Authorization header in all HTTP requests. I rely on a third party library (ADAL, here called AuthService) that exposes a acquireToken() method to get the token to be used for…
6
votes
4 answers

Angular 5 - Promise vs Observable - performance context

I have an Angular 5 site that receives data from a REST API, something like 1-4 requests to the API each page, and what happens is that the requests sometimes take a long time(and sometimes not). Now, all the requests are being performed in one…
levi
  • 675
  • 2
  • 8
  • 18
6
votes
3 answers

Execute Multiple Asynchronous Route Guards in Order

I know angular route guards execute in the specified order when the canActivate function returns a simple boolean, however, what if the guards return type Observable or Promise? Example in route: { path: 'confirm', …
Kevin LeStarge
  • 6,087
  • 3
  • 15
  • 29
5
votes
1 answer

Angular HTTP Interceptor subscribing to observable and then returning next.handle but throwing TypeError: You provided 'undefined'

I have a HTTP interceptor and before every request I check if the access token is expired, if it is, I subscribe to a http.post call from my service and then subscribe to it and when I get a new access token I call next.handle(request) like this: …
5
votes
3 answers

RXJS Stop propagation of Observable chain if certain condition is met

Introduction I'm trying to create a route guard in Angular2+ using Observable from the shared service which holds the string value of current user role. The problem is obviously in shifting my mind from Promises to Observables. What I made so far…
1
2 3
15 16