One of the challenges I'm currently facing in my Angular application is the synchronization of data from a server. To keep track of when the last synchronization took place, I have implemented a function to retrieve this information:
fetchLastSyncDate(): Observable<Date> {
return this.ormService.manager$.pipe(
switchMap(manager => manager.find(OfflineStatusEntity)),
map(statusArr => statusArr[0]!.lastSync || new Date(0))
);
}
The actual synchronization process is initiated by the following function:
synchronizeData(): Observable<void> {
const syncDate = new Date();
return this.fetchLastSyncDate().pipe(
switchMap(modifiedAfter =>
this.httpClient.get<SynchronizationDto>(
`${this.baseUrl}/${DateTime.fromJSDate(modifiedAfter).toISO()}`
)
),
switchMap(data => from(this.updateDataFromServer(data, syncDate)))
);
}
To update the synchronization date after a successful synchronization, I've included the following method:
private async updateDataFromServer(
data: SynchronizationDto,
syncStart: Date
): Promise<void> {
...
// save sync date
const manager = (await firstValueFrom(this.ormService.dataSource$)).manager;
const status = (await manager.find(OfflineStatusEntity))[0]!;
status.lastSync = syncStart;
await manager.save(status);
}
For real-time display of the last synchronization time in the UI, I have integrated the subscription logic as shown below:
export class MyComponent implements OnInit {
subscription = new Subscription();
lastSyncTime: string | null = null;
ngOnInit(): void {
this.subscription.add(
this.synchronzationDataService.fetchLastSyncDate().subscribe(newSyncDate => {
this.lastSyncTime = newSyncDate.toLocaleString('de-CH');
this.changeDetectorRef.markForCheck();
})
);
}
}
Although the initial load correctly displays the latest sync time, I encounter an issue where the lastSyncTime value does not update after running a synchronization task. Any guidance on what could be missing would be greatly appreciated.
As I navigate through the realm of observables, I find myself questioning whether my understanding of subscriptions aligns with the intended behavior. Shouldn't subscribing to an observable function automatically trigger the subscription upon any changes in the observable's value?