Question

我正在调用此2函数 this.fetchTables（）; this.fetchAllTables（）;在Angular中demo.ts文件的构造器中。

两个都获得api调用。在这两个呼叫中，每次都有1个呼叫失败。有时我得到fetchTables的结果。有时我会得到fetchallTables的结果。

      constructor(private api:BackendApiService, private spinner: NgxSpinnerService, private utills:CommonUtillsService, private router: Router) {
            // reload or refresh page on active click
            this.router.routeReuseStrategy.shouldReuseRoute = function() { return false; }; 
this.fetchTables();
    this.fetchAllTables();

           }

           fetchTables() {
            this.api.getTableAccess().subscribe(data => {
              this.spinner.hide();
              console.log('Data to get tables', data);
              if(data) {
                this.data = data.body.entities;
                this.showNoTableRecordList = false;
              }
            },
            (err: HttpErrorResponse) => {
              if (err.status == 401) {
                window.location.href = Constants.GANDALF_HOST;
              }
              this.spinner.hide();
              if (err.error instanceof Error) {
                //A client-side or network error occurred.
                toast(Constants.TOAST_PREFIX+Constants.SOMETHING_WRONG, Constants.TOAST_DURATION);
              } else {
                //Backend returns unsuccessful response codes such as 404, 500 etc.
                toast(Constants.TOAST_PREFIX+Constants.SOMETHING_WRONG, Constants.TOAST_DURATION);
              }
            });
           }

          fetchAllTables() {
            this.api.getAllTable().subscribe(data => {
                this.spinner.hide();
                if(data) {
                  this.allTables = data.body;
                  this.showNoTableRecordList = false;
                } else {
                  this.showNoTableRecordList = true;
                }
              },
              (err: HttpErrorResponse) => {
                if (err.status == 401) {
                  window.location.href = Constants.GANDALF_HOST;
                }
                this.spinner.hide();
                if (err.error instanceof Error) {
                  //A client-side or network error occurred.
                  toast(Constants.TOAST_PREFIX+Constants.SOMETHING_WRONG, Constants.TOAST_DURATION);
                } else {
                  //Backend returns unsuccessful response codes such as 404, 500 etc.
                  toast(Constants.TOAST_PREFIX+Constants.SOMETHING_WRONG, Constants.TOAST_DURATION);
                }
              });
          }

Answer 1

您不会在两个可观察对象中都包含子项，而是会使用RxJS合并两个可观察对象。有两种方法可以将它们组合在一起：一种方法是CombineLatest，如果每个子对象都发出一次，然后在子对象上再次发出，则该元素会发出。以下是所有合并运算符的文档：https://www.learnrxjs.io/operators/combination/

要在某个可观察对象发出时执行某些操作，如果您不想在合并的可观察对象的一个订阅中完成订阅中的所有操作，则可以使用tap运算符

Answer 2

我认为这两个可观察对象的订阅都存在一些错误（由于此处共享了部分文件，我无法识别）。因此，只要其中一个请求完成，它的订阅都会被执行，这会引发错误，从而阻止第二个订阅运行。

我可能是错的，但是我需要更多有关您的错误的信息来确认。另外，如@Erbsenkoenig所述，如果您打算一起进行两个调用，我建议您使用concatMap或mergeMap或类似的东西。

Angular2中的异步调用

2 个答案: