路由器无法解决AngularFirestore返回的导航Angular

时间:2019-04-26 15:43:34

标签: angular typescript angularfire2 angular-router

下面的编程逻辑无法解决导航问题。

我一定做错了,但我无法确定问题所在。

如果我创建一个单独的函数并运行 combineLatest()运算符并进行订阅,则会收到两个 Observables 的值。

我需要解决两个 Observable 类型的返回,需要从我的组件访问。

this.convenios = this._route.snapshot.data ['data'] [0];
this.pacientes = this._route.snapshot.data ['data'] [1];

resolve.ts:

@Injectable({
   providedIn: 'root'
})
export class PacienteFormService implements Resolve<any>
 {
   public routeParams: Params;

constructor(
    private _pacientesService: PacientesService, // extends Database
    private _conveniosService: ConveniosService, // extends Database
) {
}

resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<[Paciente, Convenio[]]> {

    this.routeParams = route.params;
    const pacienteId = this.routeParams.id;

    return combineLatest(
        this._pacientesService.get(pacienteId),
        this._conveniosService.list()
    );
}

database.ts:

@Injectable({
    providedIn: 'root'
})
 export abstract class Database<IBaseEntity> implements 
 IDatabaseService<IBaseEntity> {

protected collection: AngularFirestoreCollection<IBaseEntity>;

constructor(
    private path: string,
    protected afs: AngularFirestore,
    protected auth: AuthService,
) {
    const pathRef = `${this.auth.firestoreCollection}/${this.path}`
    this.collection = this.afs.collection(pathRef);
}

public get(identifier: string): Observable<IBaseEntity> {
    return this.collection
        .doc<IBaseEntity>(identifier)
        .snapshotChanges()
        .pipe(
            map(doc => {
                if (doc.payload.exists) {
                    const data = doc.payload.data() as any;
                    const id = doc.payload.id;
                    return { id, ...data };
                }
            })
        );
}

public list(): Observable<IBaseEntity[]> {
    return this.collection
        .snapshotChanges()
        .pipe(
            map(changes => {
                return changes.map(a => {
                    const data = a.payload.doc.data() as any;
                    data.id = a.payload.doc.id;
                    return data;
                });
            })
        );
}

1 个答案:

答案 0 :(得分:0)

我前段时间也遇到过同样的问题,问题是可观察对象无法解决。要解决此问题,您应该使用take(1)first()

return combineLatest(
  this._pacientesService.get(pacienteId),
  this._conveniosService.list()
)
.pipe(first());