I have a website, where a settings dialog should be loaded in a specific are, when clicked on a button.
The settings dialog is a component which loads data from REST endpoints.
I don't want to insert the component and just hide it, since I want to save resources.
What's the correct Angular 2 way to do this?
You can use
ngIf for that kind of purpose, it will insert element only if the condition is true
<div *ngIf="condition"> <!-- Content present in DOM only if condition == true --> </div>
This way your data won't be loaded at runtime, but when the component is inserted (=> when the condition becomes true).
EDIT : Load based on shouldBeLoaded, then show / hide based on shouldBeDisplayed ; once shouldBeLoaded is set to true, its value should not change
<component *ngIf="shouldBeLoaded" *ngShow="shouldBeDisplayed"> </component>