Since the update of Angular Material2 beta7, the styling information seems to be broken for AOT setups, due to this breaking change.
The field margins seem to be gone and the underline too. Everything seems to be lined up in one line.
Eventhough I have properly set the angular material prebuilt theme as described here under step 4.
Just found the solution.
This part here in the index.html wont work if you are using Angular with AOT (preferred way).
<link href="../node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css" rel="stylesheet">
The Angular AOT compiler will not scrape in the header links of the index.html file. Instead, you need to copy the desired theme file from your node_modules folder and assign it to your default styling in your Angular app.
In my case, I had a themes.scss file in which I could simply import it like so:
@import "src/theme/deeppurple-amber";
Now it works. Good luck!