2017-03-18 2 views
7

을 선택했습니다. 토글 그룹에서 기본 선택 버튼을 어떻게 설정할 수 있습니까?각도 재료 2 버튼 토글 기본적으로 각도 재료 2로

한 번 탭하면 전환되지만 기본적으로 어떻게 든 선택됩니다. 다음과 같이 시도했지만 작동하지 않습니다.

<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> 

답변

12

각 버튼에 값을 할당해야하며 그룹에 초기 값 (버튼 중 하나와 일치)을 부여 할 수 있습니다.

<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> 
5

나는 초보자지만 작동해야합니다. 두 개의 값 "one", "two"를 가질 수있는 변수와 함께 ngModel을 사용할 수 있습니다. "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>