What is the optimal approach for ensuring that my Angular component triggers the bound method (referred to as isItemExpended
in this scenario) whenever changes occur in the internal data model?
TypeScript
@Component({
...
})
export class ItemsComponent implements OnInit {
...
private expandedItems: Item[] = [];
public isItemExpanded(item: Item): boolean {
return this.expandedItems.indexOf(item) > -1;
}
...
}
HTML
<ng-container *ngFor="let item of items">
<div *ngIf="isItemExpanded(item)">
...
</div>
</ng-container>
Note: My solution involves a slightly more intricate implementation of the isItemExpaned
method, hence why I've avoided placing the condition directly in the HTML.