I am attempting to retrieve the current value of a BehaviorSubject without directly subscribing to it in order to avoid real-time changes reflecting immediately due to a specific requirement. My approach involves using the getValue() method.
Here is an example of the BehaviorSubject value:
{
ID_123: {
logs: [
{
id: 1,
record_id: 'ID_123',
data: { complete: false }
action: 'Modified',
description: 'Modified filename',
}
]
}
}
This is how my Service class looks like:
private logs$ = new BehaviorSubject<any>(null);
private logsDataStore = {};
logsData = this.logs$.asObservable();
...
getData(id) {
if (this.logsDataStore[id] !== undefined) {
return this.logs$.getValue();
}
}
I invoke the getData() method from within a component upon clicking a button to display the logs entries.
id = 'ID_123';
onClick() {
this.logsData = Object.assign({}, this.service.getData([this.id])[this.id]);
}
Displaying each entry in the logs:
<div *ngFor="let log of logsData.logs" class="log">
<a *ngIf="!log.data.complete" (click)="markComplete(log.record_id, log.id, log.data)">
Mark Complete
</a>
</div>
markComplete(recordId, id, data) {
let dataClone = Object.assign({}, data);
dataClone.complete = true;
this.service.updateLog(recordId, id, dataClone);
}
Returning back to the Service class:
updateLog(recordId: string, id: string, newValues: object) {
const selectedRecord = this.logsDataStore[recordId];
if (selectedRecord !== undefined) {
if (selectedRecord.logs && selectedRecord.logs[id]) {
let selectedLogEntry = selectedRecord.logs[id];
Object.keys(newValues).forEach(
(logKey) => {
selectedLogEntry[logKey] = newValues[logKey];
}
);
}
}
// this.logs$.next(Object.assign({}, this.logsDataStore));
}
The issue:
Upon clicking the Mark Complete link, it disappears instantly, even though I made sure not to subscribe directly to the service and created a clone of the results retrieved from getData(). Is there something crucial that I am overlooking?
Any insights would be greatly appreciated.