代码之家  ›  专栏  ›  技术社区  ›  Ram

Angular4在导航路线解析之前获取数据

  •  0
  • Ram  · 技术社区  · 7 年前

    我试图使用角度路由解析在路由激活之前获取组件数据。

    我看到的所有示例都调用服务中的一个方法并返回,我在服务中有5个不同的方法需要调用b4组件被激活。

    下面是我要实现的目标的示例,ContactService有3个方法,都需要调用—如何在一次调用中返回所有3个方法?

    任何指点都值得赞赏。

    下面是分解器触点

    import { Injectable } from '@angular/core';
    import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
    import { ContactsService } from './contacts.service';
    
    @Injectable()
    export class ContactResolve implements Resolve<Contact>
    {
    
      constructor(private contactsService: ContactsService) {}
    
      resolve(route: ActivatedRouteSnapshot)
      {
        return this.contactsService.getContact(route.paramMap.get('id')); //method in Service
      }
    
    //  return this.contactsService.getCities(); //Another method in Service that also needs to be called
    
     // return this.contactsService.getAllParts(); //Another method in Service that also needs to be called
    
    
    }
    
    2 回复  |  直到 7 年前
        1
  •  2
  •   martin    7 年前

    你可以用 forkJoin 这将等到所有可观测到的源完成:

    resolve(route: ActivatedRouteSnapshot) {
      return Observable.forkJoin(
        this.contactsService.getContact(route.paramMap.get('id')),
        this.contactsService.getCities(),
        this.contactsService.getAllParts()
      );
    }
    

    所有结果将在一个包含3个项的数组中可用。

        2
  •  1
  •   Yakov Fain    7 年前

    这个 Resolve 接口定义如下:

    interface Resolve<T> {
      resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<T> | Promise<T> | T
    }
    

    方法 resolve 可以返回 Observable , Promise ,或者只是某种类型的对象。在您的情况下,您应该订阅 ContactService . 当在那里接收到所有三个数据片段时,将它们组合到一个对象中,并以单独的方法返回,例如。 getCombinedData ,可以从解析程序调用。

    另一个选择是使用rxjs forkJoin 正如martin所建议的那样,但是如果您想要准备一个具有组合结果的结构化对象,请手动执行。