Hello everyone, I am currently delving into the world of Angular and facing a challenge with refreshing service data automatically by making API requests at regular intervals. The focus is on a particular service where I aim to update the shopPreferences field based on a specified timer:
@Injectable({ providedIn: 'root' })
export class ShopManagerService {
private shopPreferences: ShopPreferences = null;
setPreferences(shopPreferences: ShopPreferences) {
this.shopPreferences = shopPreferences;
}
isDeliverySlotsActive(){
if(this.shopPreferences == null || this.shopPreferences.delivery_slots == null) return;
return this.shopPreferences.delivery_slots;
}
getCurrencySymbol(){
if(this.shopPreferences == null || this.shopPreferences.currency_display_symbol == null) return;
return this.shopPreferences.currency_display_symbol;
}
...
// more data getters
}
Currently, the shopPreferences field gets initialized in a specific component using a separate ApiManagerService. Here's how it looks:
@Injectable({ providedIn: 'root' })
export class ApiManagerService {
private token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6MjcwMjA3MiwidGltZXN0YW1wIjoiMjAyMS0wNC0wOSAwOToxNToxNS4';
constructor(private http: HttpClient) {}
fetchShopPreferences(id: string) {
const url = "https://commerce.ww-api.com/commerceapi/v1/front/front_url/" + id + "/";
return this.http
.get<ShopPreferences>(url, {
headers: new HttpHeaders({
token: this.token,
}),
});
}
...
// more api requests
}
I'm seeking advice on how to refactor my code so that the ShopManagerService can handle the API request and keep the shopPreferences object updated at scheduled intervals - let's say every 2 minutes. Any suggestions or solutions would be greatly appreciated!