title: How to make dropdownlist required in angular material?
body: <p>I have a search 'form' with  angular material.  But it is not a form with a submit button. But just a button. like this:</p>
  
  <pre><code>  &lt;button mat-raised-button color="accent" class="Button" (click)="searchFor()"&gt;Filter&lt;/button&gt;
  
  </code></pre>
  
  <p>and I have a dropdownlist. But I want to make the dropdownlist required.</p>
  
  <p>Like this:</p>
  
  <pre><code> &lt;div class="search-select searchstatus" *ngIf="selectedSearch &amp;&amp; hasStatusOptions(selectedSearch)"&gt;
          &lt;mat-select placeholder="Status" name="option"  [(ngModel)]="selectedValue" required&gt;
            &lt;mat-option *ngFor="let option of getStatusOptions(selectedSearch)"  [value]="option.apiStatus"&gt;
              {{ option.status }}
            &lt;/mat-option&gt;
          &lt;/mat-select&gt;
        &lt;/div&gt;
  
  </code></pre>
  
  <p>But his doesnt work. </p>
  
  <p>So how to make the dropdownlist required? Thank you</p>
  
  <p>For datepicker it works. If I do this:</p>
  
  <pre><code>   &lt;input matInput readonly required [matDatepicker]="picker1" placeholder="start datum" [(ngModel)]="startDate" /&gt;
  
  </code></pre>
  
  <p>Then if there is no date entered the label becomes red and there is showing a *</p>
  
  <p>if I do this:</p>
  
  <pre><code>   &lt;mat-select  #statusSelect placeholder="Status" name="option"  [(ngModel)]="selectedValue" [required]="true" &gt;
  </code></pre>
  
  <p>and this:</p>
  
  <pre><code>   &lt;button [disabled] = '!statusSelect.value' mat-raised-button color="accent" class="Button" (click)="searchFor()"&gt;Filter&lt;/button&gt;
  
  </code></pre>
  
  <p>I get this error:</p>
  
  <pre><code>ExtendedSearchComponent.html:62 ERROR TypeError: Cannot read property 'value' of undefined
  </code></pre>