How to bind with component recursion in angular

Question

I got this simple code:

@Component({
    selector: 'app-tree',
    template: `<div>{{content.name}}</div>
               <app-tree [(content)]="contentChild"
                         *ngFor="let contentChild of content.childs"></app-tree>`
})
export class TreeComponent {

@Input() content: Content;

}

but the [(content)]="contentChild" throw me the following error:

ERROR Error: Uncaught (in promise): Error: Cannot assign to a reference or variable!

How to solve this?

Answer 1

Found the solution:

<app-tree [(content)]="content.childs"
   *ngFor="let contentChild of content.childs"></app-tree>

You can't have two way binding, only [reference] with *ngFor however you can bind the object directly.