Set default option in mat-select

by

Working StackBlitz

No need to use ngModel or Forms

In your html:

<mat-form-field>
    <mat-select [(value)]="selected" placeholder="Mode">
        <mat-option value="domain">Domain</mat-option>
        <mat-option value="exact">Exact</mat-option>
    </mat-select>
</mat-form-field>

and in your component just set your public property selected to the default:

selected = 'domain';

More Related Contents:

  1. Confirm password validation in Angular 6 [duplicate]
  2. Angular + Material – How to refresh a data source (mat-table)
  3. Apply a directive conditionally
  4. mat-form-field must contain a MatFormFieldControl
  5. How to import Angular Material in project?
  6. Expandable table rows in angular 4 with angular material
  7. How can i make a MatDialog draggable / Angular Material
  8. Array of formGroup within mat-table for each row
  9. To enable or disable the input field based on the value of select component in angular
  10. Angular 6 MatTable Performance in 1000 rows
  11. Filtering specific column in Angular Material table in angular 5 [duplicate]
  12. How to pass data to dialog of angular material 2
  13. custom filter in mat-table
  14. Mat-table Sorting Demo not Working
  15. How to translate mat-paginator in Angular 4?
  16. how to support same column size when screen size reducing in angular material table
  17. @angular/material/index.d.ts’ is not a module
  18. Default sorting in Angular Material – Sort header
  19. How to use paginator from material angular?
  20. How to use MatPaginatorIntl?
  21. SassError: Can’t find stylesheet to import. @use ‘~@angular/material’ as mat;
  22. Open/Close sidenav from another component
  23. Angular Mat Select Multiple selectionchange finding which option was changed
  24. How to manually set focus on mat-form-field in Angular 6
  25. Filtering different columns in a material table
  26. How to dynamically add FormControl to FormArray on button click in Angular?
  27. Angular Material Tab : Prevent tab change of mat-tab-group if the form in current tab is dirty
  28. Angular 9 Formarray search operation executing for only first dynamic control
  29. How can I catch the Material Datepicker month pagination event?
  30. Disable click outside of angular material dialog area to close the dialog (With Angular Version 4.0+)

Leave a Comment