Angular 6 Material Nested Tree is not working with dynamic data

Question

I am using mat-tree with mat-nested-tree-node in Angular 6. What I want is to load the data dynamically when the user toggles expand icon.

Answer 1

I struggled when I implemented back when it first came out and found the UI wasnt updating because changes to an objects's properties do not get picked up by change detection. Please read through my original question and answer here. It is for a flattened tree but might save you hours of banging your head.

Why is my angular app becoming very slow after changing the data backing a mat-tree?