错误处理 – 使用Angular2异步管道进行错误处理

发布时间：2020-12-17 09:15:54 所属栏目：安全来源：网络整理

导读：我正在使用Angular2异步管道将值流入DOM.这是一个很简单的例子： const stream = Observable.interval(1000) .take(5) .map(n = { if (n === 3) throw "ERROR"; return n; });div *ngFor="for num of stream | async" {{num}}/divdiv id="error"/div 我想做

我正在使用Angular2异步管道将值流入DOM.这是一个很简单的例子：

const stream = Observable.interval(1000)
  .take(5)
  .map(n => { if (n === 3) throw "ERROR"; return n; });

<div *ngFor="for num of stream | async">
  {{num}}
</div>

<div id="error"></div>

我想做的是使1-5的顺序显示,但在错误项(3)上,以某种方式填充错误消息的#error div.

这似乎需要两件事情：首先是角色异步管道做某些智能错误的能力,我看不到任何迹象.看源代码,显然是抛出一个JS异常,似乎不太友善.

第二个是错误后重新启动或继续序列的能力.我已经阅读了关于catch和onErrorResumeNext等等,但它们都涉及另一个序列,将被切换到一个错误.这使生成流的逻辑非常复杂,我只想在其中放置一系列数字(在这个简单的例子中).我有沉没的感觉,一旦发生错误,游戏结束,观察完成,只能用不同的观察者“重新启动”.我还在学习可观察这是事实吗？

所以我的问题是双重的：

Can Angular2的异步管可以做一些聪明的错误吗？
>可观察者有一些简单的方法在错误后继续吗？

是的,你是正确的捕获运算符和能力做错事后发生的事情…

我会利用catch运算符来捕捉错误并做一些事情：

const stream = Observable.interval(1000)
  .take(5)
  .map(n => {
    if (n === 3) {
      throw Observable.throw(n);
    }
    return n;
  })
  .catch(err => {
    this.error = error;
    (...)
  });

并在模板中：

<div>{{error}}</div>

为了能够执行初始观察,您需要从发生错误的点开始创建一个新的：

createObservable(i) {
  return Observable.interval(1000)
    .range(i + 1,5 - i)
    .take(5 - i)
  });
}

并在catch回调中使用它：

.catch(err => {
    this.error = error;
    return this.createObservable(err);
  });

这两个问题可以帮助您：

> How to resumeOnError (or similar) in RxJS5
> RxJS Continue Listening After Ajax Error(最后回答)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!