Angular stuff 2 buttons selected by default

in angular material 2, How can I set the default button in the switch group.

It switches as soon as I click one, but both by default somehow. I tried to do the following, but it does not work.

<md-button-toggle-group #group="mdButtonToggleGroup"> <md-button-toggle (click)="firstTapped()" selected> <span>one</span> </md-button-toggle> <md-button-toggle (click)="secondTapped()"> <span>second</span> </md-button-toggle> </md-button-toggle-group> 
+7
angular angular-material
source share
2 answers

You need to assign a value to each button, and then you can give the group an initial value (corresponding to one of the buttons);

 <md-button-toggle-group #group="mdButtonToggleGroup" value="button1"> <md-button-toggle value="button1"> <span>one</span> </md-button-toggle> <md-button-toggle value="button2"> <span>second</span> </md-button-toggle> </md-button-toggle-group> 
+12
source share

I'm only new to materials, but this should work. You can use ngModel with a variable that can have two values: one, two. Than you can observe changes using "yourFunction".

 <md-button-toggle-group (ngModelChange)="yourFunction($event)" [ngModel]="selected"> <md-button-toggle value="one"> <span>one</span> </md-button-toggle> <md-button-toggle value="two"> <span>second</span> </md-button-toggle> </md-button-toggle-group> 
+5
source share

All Articles