How to switch between md-tabs and select a specific one dynamically after Submit?

I'am using in an index page md-tab-group where I do have two tabs and each tab has its own component - signin.component and register.component:

<md-tab-group>
   <md-tab label="signin"></md-tab>
   <md-tab label="register"></md-tab>
<md-tab-group>

By loading the page, the signin tab is activated/selected by default. But when a user switch to register-tab and submits the register form, which is working fine, then I would like to switch to the signin tab and make it selected. Means that the user can login after registration - which makes sense.

The Issue is that I can't manage to move and select/activate the signin tab after registration. the register tab keeps selected, which would confuse the users.

The <md-tab-group> is being directly embedded in signin.component.html and the register form is being loaded via router when clicking the register tab:

<md-tab-group #tabGroup>
     <md-tab label="signin">
         <form>
            <input....>
         </form>
     </md-tab>
     <md-tab label="regsiter">
         <router-outlet name="register"></router-outlet>
     </md-tab>
</md-tab-grou>

I tried couple of ideas but unfortunately none of them gave me the expected result.

Any Hint or Idea please?

at first you need to create a service called SwitchTabService to achive communication between components.

import { Injectable, EventEmitter } from '@angular/core';

@Injectable()
export class SwitchTabService{
   public onRegisterFinish = new EventEmitter();
}

add that service to the app.module.ts providers

...
providers: [
   ...
   SwitchTabService
   ...
]
...

you can use the two-way data-binding as follows:
signIn.component.html file

<md-tab-group [(selectedIndex)]='currentSelectedIndex'>
   <md-tab label="signin"></md-tab>
   <md-tab label="register"></md-tab>
<md-tab-group>

and inside the signIn.component.ts file

import {Component, OnInit} from '@angular/core';
import { SwitchTabService } from '??';    

@Component({
  ...
})
export class SignInComponent implements OnInit{
  currentSelectedIndex;
  signInIndex = 0; // assuming the index of signIn tab is 0 or the first

  constructor(private switchTabService: SwitchTabService) {}      

  ngOnInit() {
     this.switchTabService.onRegisterFinish.subscribe( () => {
        this.onRegisterFinished();
     });
  }      

  onRegisterFinished() {
     this.currentSelectedIndex = this.signInIndex;
     // this will change the selected tab to signIn tab.
  }
}

in the register.component

import {Component, EventEmitter} from '@angular/core';
import { SwitchTabService } from '??';    

@Component({
  ...
})
export class RegisterComponent{

  constructor( private switchTabService: SwitchTabService) {}       

   onSubmitForm() {
     // you submit Logic
     this.switchTabService.onRegisterFinish.emit();
   }
}