angular material 2 button toggle by default selected
在angular材料 2 中,如何在切换组中设置默认选定按钮。
一旦我点击一个,它就会切换,但默认情况下都会以某种方式选中。
我尝试如下,但不起作用。
1 2 3 4 5 6 7 8 | <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> |
您需要为每个按钮分配一个值,然后您可以给组一个初始值(匹配其中一个按钮);
1 2 3 4 5 6 7 8 | <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> |
我只是材料的初学者,但这应该可以。您可以将 ngModel 与可以有两个值 "one"、"two" 的变量一起使用。您可以使用"yourFunction"观察变化。
1 2 3 4 5 6 7 8 | <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> |
使用选中而不是选中,例如:
1 | <md-button-toggle (click)="firstTapped()" checked> |