angular2 forms - More than one select button validation is not working in angular 2 reactive validation -

only first select input field shows validation red mark, second 1 show blurring of second button. both have show remark when submit button clicked without selecting option.

please guide me wrongs , should have fix?

import { component }                          '@angular/core';  import { formbuilder, formgroup, validators } '@angular/forms';    @component({    selector: 'form-detail',    templateurl: './form-detail.component.html'  })    export class formcomponent {    form: formgroup;    fruits: = [      {"viewvalue": "apple", "value": "apple"},      {"viewvalue": "mango", "value": "mango"}    ];        foods: = [      {"viewvalue": "food1", "value": "food1"},      {"viewvalue": "food2", "value": "food2"}    ];      constructor(private fb: formbuilder) {      this.createform();    }      createform() {      this.form = this.fb.group({           fruits: ['', validators.required ],          foods: ['', validators.required ],        });    }        onsubmit(){      if(this.form.valid){        console.log('valid form');      }else{        console.log('invalid form');     }    }  }

<form [formgroup]="form"  (ngsubmit)="onsubmit()">  <md-select placeholder="favorite food" formcontrolname="foods" #foods>    <md-option *ngfor="let food of foods" [value]="food.value">      {{ food.viewvalue }}    </md-option>  </md-select>    <md-select placeholder="favorite fruits" formcontrolname="fruits" #fruits>    <md-option *ngfor="let fruit of fruits" [value]="fruit.value">      {{ fruit.viewvalue }}    </md-option>  </md-select>    <button type="submit"> submit</button>  </form>