We’ve all been there – you’re working on an Angular component and things aren’t quite working out as you expect. You need to quickly see what’s happening with your inputs, or maybe your component is being rendered conditionally and you need to understand at what point it’s being initialised and destroyed on the page.
Most of the time you end up doing something like this:
public ngOnDestroy(): void {
console.log('SheepStacker component destroyed');
}
public ngOnChanges(changes: SimpleChanges): void {
for (const prop in changes) {
console.log(prop, changes.prop.currentValue);
}
}
However there are problems with this code, and it’s a pain to write out each time.