I have this problem in my angular app that since I'm caching data. After I'm adding something using the onCreate() function. I called the getAll() function in the successfull subscribe function in order to get the new data. However, I still don't get the new data. I believe that it is because of the cache data in my service. How would i know if there's a new data or How would i fix my cache my existing datas and refreshing of data when there's new data?
service
getAll() {
if(!this.materials) {
this.materials = this.httpClient.get<any>(this.url)
.map((response => response))
.publishReplay(1)
.refCount();
}
return this.materials;
}
getAll() ts
getAllMaterials() {
this.subscription = this.materialsService.getAll()
.subscribe(
(data:any) => {
this.materials = data.materials;
console.log(data);
},
error => {
alert("Error");
console.log(error);
});
}
onCreate() -ts
onCreateMaterial(form: NgForm){
const formData = {
sku: form.value.sku,
name: form.value.name,
supplier_id: form.value.supplier,
price: form.value.price
}
this.materialsService.addMaterial(formData)
.subscribe(
data => {
let message = data.message;
alert(message);
console.log(data);
this.modalRef.close();
this.getAllMaterials();
},
error => {
alert("Error Adding");
console.log(error);
});
}
Did some research on
.publishReplay().refCount()you can read it here. I think the problem is that you are using.publishReplay().refCount()before you subscribe, so that the subject is marked as completed after one iteration, so it will never fire again. Read about it here. I am not familiar with this myself, but worth a shot.If it's not that try to remove the parameter of publishReplay and try to manually unsubscribe to see if it has any results.