Question

下面是完整的示例：https://ng-bootstrap.github.io/#/components/table/examples，我正在实现一个具有排序，搜索和分页功能的表。我正在使用Angular 7和最新版本的ng-bootstrap。

该示例使用对象的静态数组：

// 1. sort
    let countries = sort(COUNTRIES, sortColumn, sortDirection);

我正在尝试找到一种方法，该方法将从HTTP GET请求返回的可观察对象的订阅传递数组到同一位置。

问题是HTTP GET需要大约一秒钟的时间才能从API检索。这将导致订阅返回一个空数组，并且不应用排序，搜索和分页。

在排序开始之前，如何让对象服务等待数据返回并填充数组？

我有一个API服务。我们称之为对象类型组。我的网上论坛服务正在API服务中调用一个名为getgroups（）的方法。我试过了： -订阅API服务中的公共行为主题。

订阅API服务中getgroups（）的返回行为主题对象。
我试图延迟组服务中的排序，以尝试等待GET请求完成。这似乎没有影响。
我尝试放置来自组构造函数的代码：

this._search$.pipe(
      tap(() => this._loading$.next(true)),
      debounceTime(200),
      switchMap(() => this._search()),
      delay(200),
      tap(() => this._loading$.next(false))
    ).subscribe(result => {
      this._groups$.next(result.groups);
      this._total$.next(result.total);
    });

    this._search$.next();

在分配数据后的HTTP GET请求中：

this.http.get<Group[]>(environment.apiEndpoint").(
      (resultGroups: Group[]) => {
        groups.next(resultGroups);
HERE -->
      },
      (err: any) => {
        console.log(err);
      },
      () => { 
      }
    );

我添加了扩展日志记录，该记录显示了事物的调用顺序。

API服务开始HTTP GET请求
组服务记录一个空的Behavior Subject对象
组件控制器返回一个可观察到的空白
组服务将所有组的列表返回给组件控制器（每个分页设置应仅前10个
API服务完成请求

我希望API服务能够开始和完成，然后组服务进行更新并将排序和分页的数据返回给组件控制器。

Answer 1

我发现了造成这些问题的根本原因。我正在用HTTP请求中的数据填充Observable。我使用相同的可观察结果作为排序/搜索/分页的结果。这些文件必须放在单独的变量中才能正常工作。

如何处理HTTP Get请求并填充到ng-bootstrap表中？

1 个答案: