With the new *ngComponentOutlet directive it is now possible to create dynamic components on a declarative way. The old way to create dynamic components was very heavywight and complex, because you have to write a lot of programming code.
Now with *ngComponentOutlet it is much more easier. The following example shows how to implement a component that recognize if it is a first time visitor or a repeating visitor. Dependent on the type of visitor the corresponding component will be used.

@Component({
  selector: ‘app-first-time-visitor’,
  template: ‘<h1>Welcome to b-nova!</h1>’,
})
export class FirstTimeVisitorComponent {}

@Component({
  selector: ‘app-repeating-visitor’,
  template: ‘<h1>Welcome Back to b-nova!</h1>’,
})
export class RepeatingVisitorComponent {}

@Component({
  selector: ‘app-root',
  template: `
        <h1>Hello b-nova Friend</h1>
        <ng-container *ngComponentOutlet="welcome"></ng-container>
  `,
})
export class App implements OnInit{
  welcome = FirstTimeVisitorComponent;
  
  ngOnInit() {
    if(!this.user.isfirstVisit){
      this.welcome = RepeatingVisitorComponent;
    }
  }
}

In the App class we define the *ngComponentOutlet with the welcome reference. The welcome reference will be initialized with the FirstTimeVisitorComponent. Then in the ngOnInit method we check if it is a first time visitor, or a repeating visitor. If it is a repeating visitor then we set the welcome reference to the RepeatingVisitorComponent and the user will see the “Welcome Back to b-nova!” message instead of the “Welcome to b-nova!” message.