Q:

Is there a way to show a new mdDialog when a button is pressed on a form?

I am making a web app and instead of routing to a whole new page when a submit button is pressed, I just want to display something else over the mdDialog or form that I already have. 
So far I am mostly just planning it out, but some pseudocode that I have is something like this:
HTML:
<form [formGroup]="firstFormUserSees">
    **input containers and what not**
</form>
<div>
   <button md-raised-button (click)="submit()"[disabled]="firstFormUserSees.invalid>Submit</button>
</div>

<form [formGroup]="secondFormUserSees" *ngIf= **something**>
    **second form stuff here**
</form>

And in the typeScript there would be a method called submit(), but I just am not sure how to go about it and am new to TS and angular 2

A:

You can use *ngIf.
For example:
Above your constructor:
show_my_form = true;

HTML
<form [formGroup]="firstFormUserSees"  *ngIf="show_my_form">
    **input containers and what not**
</form>
<div>
   <button md-raised-button (click)="submit()"[disabled]="firstFormUserSees.invalid>Submit</button>
</div>

<form [formGroup]="secondFormUserSees" *ngIf= **something**>
    **second form stuff here**
</form>

And in the function you trigger after a submit
this.show_my_form = false;

You can show and hide the content by changing the boolean. In your case hide the form and show another element. (You need to create a boolean for the other elements aswell)

