Angular的解析器函数依赖于其他解析器

Question

在Angular应用程序中，即使在加载主页之前，我也希望从后端获取数据。但是，在从后端获取数据之前，我需要向用户发送国家名称。

因此，现在数据调用取决于第一个解析器调用。在这种情况下如何处理？

以下是我的代码：

import { Routes} from '@angular/router';
import { HomeComponent } from '../pages/home/home.component';
import { ResolveService } from '../shared/service/resolve.service';
import { ResolveCountryService } from '../shared/service/resolve-country.service';

export const AppRoutes:Routes = [

    {path:"", component: HomeComponent, resolve:{ country : ResolveCountryService, data:ResolveService} }

]

在这里，ResolveCountryService需要向ResolveService共享国家名称，那么正确的管理方式是什么？

更新

如果我这样做：

export const AppRoutes:Routes = [

    {path:"", component: HomeComponent, resolve:{ country : ResolveCountryService, resolve : {data:ResolveService } } }

]

我遇到了一个错误：

src/app/shared/service/resolve-country.service"' has no exported member 'ResolveCountryService'.

- 3gwebtrain

---

你能详细说明一下吗？这个问题不太清楚。 - Manel Alonso

你可以创建一个服务，负责检索和存储用户所在的国家。只需将此服务作为数据服务的依赖项添加（类似于在构造函数中声明任何其他服务），这样你就可以检查国家是否可用，如果不可用，则先解析国家，然后再解析数据。 - tom van green

@ManelAlonso - 我需要按国家获取服务器上的数据。因此，我需要找到用户所在的国家，并将国家名称用于从后端获取数据，当两者都完成后，页面就可以加载了。如果需要更多信息，请告诉我。 - 3gwebtrain

Answer 1

你可以像async和await所示的那样使用它，该示例在this plunkr中。

例如，您将拥有一个async方法，它将返回具有所需结果的promise（这将是您在执行任何其他操作之前想要等待的第一次调用）。

然后，您可以在另一个async方法中调用它并await它。 （如果您想要的话，可以在try/catch中等待它。）

在您的情况下，ResolveCountryService将等待检索用户国家的方法。

注意：await仅适用于promises，但您可以在返回promise的async方法中解析observable以await它。

- Maxime Lafarie

Answer 2

你应该使用 flatMap。

export class YourDataResolver implements Resolve<object> {
     constructor(private dataService: DataService, private countryService: CountryService) { }

      resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<YourDataType> {

           return this.countryService.getCountry().flatMap( country=> 
               return this.dataService.findByCountry(country)
          ));
       }
}

- Toshkata Tonev