angular - Angular 6 中使用 Observable 的 $q.when、$q.defer 和 defer.promise 的替代品是什么

标签 angular rxjs observable angular-promise

我正在从 Angularjs 升级到 Angular 6,在 AngularJS 中,他们使用 Promises 和一些 $q 函数,我找不到某些函数的替代品。我正在寻找 $q.when、$q.defer、Defer.resolve() 和 Defer.promise 的替代品。如何使用 Observable 来实现这一点?

common.$q.when(checkDuplicate()).then(function (dupSc) {
 if(dupsc.length !== 0){
  some functions...
    }}

function checkDuplicate() {
        var defer = common.$q.defer();
        var url = "XYZ"
        dataService.getData(url).then(function (response) {
            defer.resolve(response.value);
        });
        return defer.promise;
    }

现在我想使用 Observable 将所有这些函数转换为 Angular 6,任何人都可以建议用示例在 Angular 6 中替换此函数的最佳方法。

最佳答案

据我所知,没有一对一的比较。 $q 本质上是 Promise 的实现,由于 Angular 改用 RxJs,因此不存在一对一的映射。但是,您可以使用 $q 执行的任何操作都可以在 RxJs 中以稍微不同的方式实现。

由于这取决于你的设计要求,你想如何实现你的可观察量,我无法给出所有情况的例子,但我最近不得不改造我自己的 Angular1 项目(使用 $q.defer ()) 到 Angular7(现在使用 RxJs observables),下面是一个示例。

在 Angular1 中,搜索功能是:当用户输入时,调用后端来获取搜索数据,但一旦用户输入更多内容,就会取消该请求,并返回最新的数据,就像在 google 中一样。我为此使用了 defer() 。

在 angular2 中,可以使用 switchMap 实现相同的功能。 。 switchMap 将丢弃之前生成的所有事件,这些事件的结果对于新事件尚不可用,并等待新事件的结果。这与过早解决 defer() promise 相同。下面是我的 angular2 搜索功能的代码。

fromEvent(this.searchTextInput.nativeElement, 'keyup')
  .pipe(
    map((event: KeyboardEvent) => {
      return event.target
    }),
    debounceTime(1000),
    switchMap((searchInput: HTMLInputElement) => {
      this.searchInProgress = true
      this.searchText = searchInput.value

      if (this.searchText.length > 0) {
        return this.pluginService.searchPlugins(searchInput.value)
      } else {
        return EMPTY
      }
    })
  )
  .subscribe({
    next: (plugins: Plugin[]) => {
      this.searchInProgress = false
      this.searchResults = plugins
    },
    error: (error: HttpErrorResponse) => {
      this.searchInProgress = false
      this.errorChange.emit(error)
    }
  })

关于angular - Angular 6 中使用 Observable 的 $q.when、$q.defer 和 defer.promise 的替代品是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53954347/

相关文章:

typescript - 错误 TS2339 : Property 'do' does not exist on type 'Observable<HttpEvent<any>

angular - Observable.forkJoin 和数组参数

angular - 如何解决 "unexpected token : A constructor, method, accessor, or property was expected"错误?

Angular 项目生产构建在导入谷歌字体时出现问题

angular - 上传和预览 GLTF 文件 (3D)

Angular HttpClient : Post method does not set parameter correctly

基于条件的RXJS条件switchMap

angular - 将类添加到自定义组件 Angular 2

angular - 在继续之前如何等待 for 循环内的订阅完成

ios - 用于将 Single<[Element]> 转换为 Observable<Element> 的 rxSwift 扩展