Currently, I am working on fetching data into a component before it loads to customize some settings. However, I find the concept of resolver a bit confusing in terms of what it returns and how to interpret it.
I am struggling with getting the correct data types and understanding the proper way to call the fetch function to retrieve an Array that can be utilized in my component.
The Resolver snippet:
import {ActivatedRouteSnapshot, Resolve, RouterStateSnapshot} from "@angular/router";
import {Observable} from "rxjs";
import {Injectable} from "@angular/core";
import {EntryService} from "../app/entry.service";
import { Entrymodel } from "./entry.model";
@Injectable()
export class SinglePostResolver implements Resolve<any>{
entries :Entrymodel[] = [];
constructor(
private entry:EntryService,
){
}
resolve(): Observable<any>//:Observable<EntryModel>{
return this.entry.getAventry()
}
}
An example of the Entry model structure:
export class Entrymodel {
id: string;
surname: string;
color: string;
startDate: Startdate;
endDate: Enddate;
info: string;
status?: string;
inbet?: Inbetween[];
editing?: boolean;
}
export class Startdate{
day: string;
month: string;
year: string;
}
export class Enddate{
day: string;
month: string;
year: string;
}
export class Inbetween{
day: string;
month: string;
year: string;
}
The Fetch function:
getAventry(){
return this.firestore.collection('entry', x => x.where('status' , '==', 'Attending')).snapshotChanges();
}
The goal is to reach this point:
ngOnInit(): void{
this.route.data.subscribe( (data) => {
});
console.log(this.entries)
}
The assigned route configuration:
{ path: 'calendar', component: CalendarComponent, resolve: { singlePost: SinglePostResolver}}
My main confusion lies in correctly invoking the fetch within the resolver.
Should I subscribe or pipe? I am unsure about handling it and modifying the resolver's return value in the route. How do I convert that data into an accessible array?
I've attempted some ineffective approaches. While I have gone through the documentation on Observables and rxjs in Angular, I am finding it challenging to grasp the intricacies when dealing with Interfaces and Classes in conjunction with observables.