I'm working on my first angular application and experiencing some issues with updating / re-rendering my component.
In my component, I have an update function that fetches a resource from my backend and saves the result in a variable called taskList. I would like for the component to be updated / re-rendered every time this function is called.
update = async () => {
const url = 'http://localhost:3000/tasks/' + this.date.valueOf();
const data = await fetch(url);
const result = await data.json();
this.taskList = result.tasks
};
I display the values of the list like such:
<div
<div
*ngFor="let tasks of taskList"
class={{tasks.color}}
{{tasks.text}}
</div>
</div>
I then have another case where I add items to the list followed by calling the update function. It successfully updates the taskList variable but doesn't re-render the component.
I have attempted different implementations of ChangeDetectorRef that I found online with no success.