rxjs

Rxjs catchError not working when subscribe after pipe

由 ＊爱你＆永不变心＊ 提交于 2020-01-11 14:46:48
问题 I have created an observable to consume an API Observable:- return this.http.post('/api/ApplicationUser/Login', loginDetails, httpOptions).pipe( map((result: any) => { localStorage.setItem('jwtToken', result.jwtToken); localStorage.setItem('refreshToken', result.refreshToken.value) localStorage.setItem('UserName', result.userName); return result; }), catchError((err: any) => { //this.userLogout() console.log('refresh error') return throwError(err); }) ); } Above code is working fine by

refactor fat arrow nested rxjs stream

由 随声附和 提交于 2020-01-11 13:47:22
问题 I am playing with http://reactivex.io/learnrx/. In better effort to learn rxjs. The array that I am working through is below. I am just trying to get the id's out of the array. I am able to get the answer to work but feel that answer could be better written. var movieLists = [ { name: "New Releases", videos: [ { "id": 70111470, "title": "Die Hard", "boxart": "http://cdn-0.nflximg.com/images/2891/DieHard.jpg", "uri": "http://api.netflix.com/catalog/titles/movies/70111470", "rating": 4.0,

Error: Property 'map' does not exist on type 'Observable'

由 别来无恙 提交于 2020-01-11 13:36:11
问题 After I updated angular/cli, I got an error: error TS2339: Property 'map' does not exist on type 'Observable<Response>' I tried every possible solution from Property 'map' does not exist on type 'Observable<Response>' but still the error exists. 回答1: Its easy to post an answer when you provide your code instead of a screenshot. Anyhow , you have to pipe it: getUsers() { return this._http.get(this.baseUrl+'/show-users', this.options) .pipe( map((response:Response)=>response.json()) ); Remember

Angular 5 getting array issue with data from service to component to template [duplicate]

由 ぐ巨炮叔叔 提交于 2020-01-11 03:41:08
问题 This question already has answers here : Data returning from api call through service to component is an object and seems to need to be an Array for Angular (2 answers) Closed 2 years ago . Trying to display data in template HTML from a component to service call which calls and returns an API, but I'm getting this error ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays. HTML <li *ngFor="let item of

angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )

由 故事扮演 提交于 2020-01-11 02:28:49
更新 2019-07-17 function abc(): Promise<string>{ return new Promise(resolve => { resolve('dada'); console.log('yeah') }); } resolve 之后你再调用 resolve 外部是不会理会的, 这和 .next 不同 另外 resolve 也不等于 return; resolve 之后的代码依然会执行. Promise 是 ES 6 Async/Await 是 ES 7 Rxjs 是一个 js 库 在使用 angular 时，你会经常看见这 3 个东西. 它们都和异步编程有关，有些情况下你会觉得用它们其中任何一个效果都一样. 但又觉得好像哪里不太对.... 这篇就来说说，我在开发时的应用方式. 在 Typescript 还没有支持 Async/Await 的时候, angular 就已经发布了. 那时我们只想着 Promise vs Rxjs 这 2 者其实很好选择, 因为 "可读性" 和 "代码量" 是差不错的. 而 Rxjs 有一些 Promise 没有的特性. 比如一堆的 operator, 这让我们很方便的操作 stream, 这是 Promise 没有的. (可以去看看如何用 rxjs 来实现 search text, triple click 等等,

angular2 学习笔记 ( rxjs 流 )

由 夙愿已清 提交于 2020-01-10 02:28:01
更新: 2019-12-12 finalize 以前都只是拿它当 c# try catch finally 用。今天懂多一点了。 因为 ng form 的一个 bug ! https://github.com/angular/angular/issues/14542 v2.4 的 bug, 到 v9.0 还没有 fix ... 唉... work around 就是用来这个 finalize. 首先要知道一个流, 如果发生了 error, 那么它就 stop 了, 这时候 subject.isStopped 是 true complete 也会让一个 stream stop 掉. 还有 unsubscribe 也是. 而 finalize 就是在一个流 stop 掉的时候被调用的. 这位朋友的 work around 很聪明丫, 利用了 timer + finalize timer 会触发 complete 然后 subscribe 会先执行, 最后 finalize 更新 status 多一次, 就触发了 emit 更新: 2019-11-24 startWith 和 pairwise s.pipe( startWith('c'), map(v => v + 1), tap(v => console.log(v)), // c1 startWith(null), pairwise

Angular 2 - Countdown timer

由 别说谁变了你拦得住时间么 提交于 2020-01-09 18:23:19
问题 I am willing to do a countdown timer in Angular 2 that start from 60 (i.e 59, 58,57, etc...) For that I have the following: constructor(){ Observable.timer(0,1000).subscribe(timer=>{ this.counter = timer; }); } The above, ticks every second, which is fine; however, it goes in an ascending order to an unlimited number. I am not sure if there is a way to tweak it so I can have a countdown timer. 回答1: There are many ways to achieve this, a basic example is to use the take operator import {

Angular 2 - Countdown timer

由 别来无恙 提交于 2020-01-09 18:22:32
问题 I am willing to do a countdown timer in Angular 2 that start from 60 (i.e 59, 58,57, etc...) For that I have the following: constructor(){ Observable.timer(0,1000).subscribe(timer=>{ this.counter = timer; }); } The above, ticks every second, which is fine; however, it goes in an ascending order to an unlimited number. I am not sure if there is a way to tweak it so I can have a countdown timer. 回答1: There are many ways to achieve this, a basic example is to use the take operator import {

How to make a sequence of http requests in Angular 6 using RxJS

由 試著忘記壹切 提交于 2020-01-09 11:28:11
问题 I've been looking for a solution all over the web, but couldn't find anything that fits my user case. I'm using the MEAN stack (Angular 6) and I have a registration form. I'm looking for a way to execute multiple HTTP calls to the API and each one is dependent on the returned result from the previous one. I need something that looks like this: firstPOSTCallToAPI('url', data).pipe( result1 => secondPOSTCallToAPI('url', result1) result2 => thirdPOSTCallToAPI('url', result2) result3 =>

How to make a sequence of http requests in Angular 6 using RxJS

由 ￡可爱￡侵袭症＋ 提交于 2020-01-09 11:25:40
问题 I've been looking for a solution all over the web, but couldn't find anything that fits my user case. I'm using the MEAN stack (Angular 6) and I have a registration form. I'm looking for a way to execute multiple HTTP calls to the API and each one is dependent on the returned result from the previous one. I need something that looks like this: firstPOSTCallToAPI('url', data).pipe( result1 => secondPOSTCallToAPI('url', result1) result2 => thirdPOSTCallToAPI('url', result2) result3 =>
订阅 rxjs