title: Route to other page from Modal in Angular
body: <p>I created a modal using MatDialog. This Modal can be opened from my toolbar.</p>
  
  <p>In the modal i have a tabbed page for login and sign up. Those are seperate components loaded via routing.</p>
  
  <p>Now i want to close the modal and redirect the user to another page if he or she clicks a button inside the modal. The link gets updated but my content is not shown!</p>
  
  <p>navbar->modal&lt;->LoginComponent/SignupComponent (link in here should close modal and redirect)</p>
  
  <p><strong>SignupComponent.ts:</strong>(is inside the modal)</p>
  
  <pre><code>registerBuisnessClicked() {
  this.dialogRef.close('signup');
  </code></pre>
  
  <p>}</p>
  
  <p><strong>navbar.ts:</strong></p>
  
  <pre><code>dialogRef.afterClosed().subscribe(result =&gt; {
    if (result === 'signup') {
      console.log('redirecting to signup');
      this.router.navigate(['/signup']);
    }
  });
  </code></pre>
  
  <p>For testing I created another toolobar item in my navbar, that directly routes to my signup and <strong>this works!</strong></p>
  
  <pre><code>user() {
  this.router.navigate(['/signup']);
  </code></pre>
  
  <p>}</p>
  
  <p>Inside my Modal i have the following code:</p>
  
  <p><strong>modal.html</strong></p>
  
  <pre><code>&lt;nav mat-tab-nav-bar mat-align-tabs="center"&gt;
  
          &lt;a mat-tab-link 
            (click)="switchToLogin()"
            [active]="rla1"&gt;
            Login
          &lt;/a&gt;
  
          &lt;a mat-tab-link 
            (click)="switchToRegister()"
            [active]="rla2"&gt;
            Register
          &lt;/a&gt;
  
        &lt;/nav&gt;
  </code></pre>
  
  <p><strong>modal.ts</strong></p>
  
  <pre><code>constructor(private router: Router) { }
  
  ngOnInit() {
    this.router.navigate(['/login']);
    this.rla1 = true;
    this.rla2 = false;
  }
  
  switchToRegister() {
    this.router.navigate(['/signup'], { replaceUrl: true });
    this.rla1 = false;
    this.rla2 = true;
  }
  
  switchToLogin() {
    this.router.navigate(['/login'], { replaceUrl: true });
    this.rla1 = true;
    this.rla2 = false;
  }
  </code></pre>
  
  <p>Thanks,
  Jakob</p>