angular2 material design - Reactive Forms - md-select not populating with default value

Question

I am having an issue with Angular2's material md-select component where the value from a FormGroup is not loading or being populated into the select. Here is the code...

https://embed.plnkr.co/p7Fm9lC4TxoVaZ8ydYf0/

The value for the control 'formal' is set to 1, but the UI shows as if no value is populated with the placeholder message.

Am I doing something wrong?

Answer 1

Only thing I have found so far, is that the placeholder is always present, even though you have selected a value. Please refer eg to this plunker: md-select examples

Since you have a reactive form, you could place your validation somewhere else? just as we would have to do with Angular normally. Maybe not what you are looking for, but...

As for not having a pre-selected value upon navigation, was this:

this.form = new FormBuilder().group({
  formal: [1]
  });

should be:

this.form = new FormBuilder().group({
  formal: ['1']
  });