/
radio-demo.html
30 lines (30 loc) · 1.17 KB
/
radio-demo.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<h1>Basic Example</h1>
<section class="demo-section">
<md-radio-button name="group1">Option 1</md-radio-button>
<md-radio-button name="group1">Option 2</md-radio-button>
<md-radio-button name="group1" disabled="true">Option 3 (disabled)</md-radio-button>
</section>
<h1>Dynamic Example</h1>
<section class="demo-section">
<div>
<span>isDisabled: {{isDisabled}}</span>
<button md-raised-button (click)="isDisabled=!isDisabled" class="demo-button">
Disable buttons
</button>
</div>
<md-radio-group name="my_options" [disabled]="isDisabled">
<md-radio-button value="option_1">Option 1</md-radio-button>
<md-radio-button value="option_2">Option 2</md-radio-button>
<md-radio-button value="option_3">Option 3</md-radio-button>
</md-radio-group>
</section>
<h1>Favorite Season Example</h1>
<h2>Dynamic Example with two-way data-binding</h2>
<section class="demo-section">
<md-radio-group name="more_options" [(ngModel)]="favoriteSeason">
<md-radio-button *ngFor="#season of seasonOptions" name="more_options" [value]="season">
{{season}}
</md-radio-button>
</md-radio-group>
<p>Your favorite season is: {{favoriteSeason}}</p>
</section>