Angular Material - MdInput to MatInputModule?

Question

What I'm Using

• Angular
• Angular Material ^2.0.0-beta.12

What I'm doing

• I just started a new project and installed material

• When copying some syntax from a previous project, I get an error when trying to import

'import { MdInputModule} from '@angular/material';

• After digging through the typings, it looks as though it's now changed to 'MatInputModule'
• I've updated my module to use 'MatInputModule'
• Now the HTML throws an error

'md-form-field' is not a known element:

• This is using the syntax provided from the material website

HTML

<form [formGroup]="albumEdit">
  <md-form-field>
    <input mdInput formControlName="albumTitle" placeholder="Album Title">
  </md-form-field>
</form> 

Questions

1. Am I missing something obvious here?
2. What's the best way to implement the material components in the latest build?
3. Is there some official documentation that I'm missing?

Answer 1

Since 2.0.0-beta.12, Md prefix has been removed in favor of Mat prefix. See this CHANGELOG:

Breaking Changes All "md" prefixes have been removed.Change md prefix to mat:

In your typescript,

import { MatInputModule} from '@angular/material';

and in you template:

<mat-form-field>
    <input matInput formControlName="albumTitle" placeholder="Album Title">
</mat-form-field>

The documentation on the website is outdated and needs to be update with mat prefix.

Answer 2

For angular 8+

import {MatInputModule} from '@angular/material/input';