At this point, we have a router state. The router can now activate this state by instantiating all the needed components, and placing them into appropriate router outlets.
To understand how it works, let's take a look at how we use router outlets in a component template.
The root component of the application has two outlets: primary and popup.
@Component({ template: ` ... <router-outlet></router-outlet> ... <router-outlet name="popup"></router-outlet> ` }) class MailAppCmp { }
Other components, such as ConversationCmp
, have only one:
@Component({ template: ` ... <router-outlet></router-outlet> ... ` }) class ConversationCmp { }
Other components, such as ConversationCmp
, have only one:
@Component({ template: ` ... <router-outlet></router-outlet> ... ` ...