javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 08:09:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(demo): test out the radio button group

Browse Source
This commit is contained in:
Ken Sodemann
2017-11-21 09:36:20 -06:00
parent af545aaa1e
commit ad9e73bb24
6 changed files with 117 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
packages/angular/demo/src/app/group-inputs-page/group-inputs-page.component.html
View File

@ -8,6 +8,11 @@
<h2>Radio Buttons</h2>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<h3>Angular</h3>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<input id="stdBeef" type="radio" value="beef" [(ngModel)]="radioValue" />
@ -26,35 +31,72 @@
<span id="radioOutput">{{radioValue}}</span>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<h3>Ionic With Radio Group</h3>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-list>
<ion-radio-group [{ngModel}]="radioValue">
<ion-radio-group id="radio-group" name="radio-group" [(ngModel)]="radioValue">
<ion-item>
<ion-label>Crarne Asada</ion-label>
<ion-radio value="beef"></ion-radio>
<ion-radio id="ion-grp-beef" name="ion-grp-beef" value="beef"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Lengua</ion-label>
<ion-radio value="tongue"></ion-radio>
<ion-radio id="ion-grp-tongue" name="ion-grp-tongue" value="tongue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Sesos</ion-label>
<ion-radio value="brains"></ion-radio>
<ion-radio id="ion-grp-brains" name="ion-grp-brains" value="brains"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Tripa</ion-label>
<ion-radio value="tripe"></ion-radio>
<ion-radio id="ion-grp-tripe" name="ion-grp-tripe" value="tripe"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Pollo</ion-label>
<ion-radio value="chicken"></ion-radio>
<ion-radio id="ion-grp-chicken" name="ion-grp-chicken" value="chicken"></ion-radio>
</ion-item>
</ion-radio-group>
</ion-list>
</ion-col>
<ion-col></ion-col>
</ion-row>
<ion-row>
<ion-col>
<h3>Ionic Without Radio Group</h3>
</ion-col>
</ion-row>
<!-- <ion-row>
<ion-col>
<ion-list>
<ion-item>
<ion-label>Crarne Asada</ion-label>
<ion-radio value="beef" id="ion-beef" name="ion-beef" [(ngModel)]="radioValue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Lengua</ion-label>
<ion-radio value="tongue" id="ion-tongue" name="ion-tongue" [(ngModel)]="radioValue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Sesos</ion-label>
<ion-radio value="brains" id="ion-brains" name="ion-brains" [(ngModel)]="radioValue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Tripa</ion-label>
<ion-radio value="tripe" id="ion-tripe" name="ion-tripe" [(ngModel)]="radioValue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Pollo</ion-label>
<ion-radio value="chicken" id="ion-chicken" name="ion-chicken" [(ngModel)]="radioValue"></ion-radio>
</ion-item>
</ion-list>
</ion-col>
<ion-col></ion-col>
</ion-row> -->
</ion-grid>
<a href='home'>Home</a>

2
packages/angular/demo/src/app/shared/ion-select-value-accessor/ion-select-value-accessor.directive.ts
View File

@ -6,7 +6,7 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
// https://github.com/angular/angular/blob/5.0.2/packages/forms/src/directives/select_control_value_accessor.ts#L28-L158
@Directive({
/* tslint:disable-next-line:directive-selector */
selector: 'ion-select,ion-radio-group',
selector: 'ion-select, ion-radio-group',
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IonSelectValueAccessorDirective, multi: true }]
})
export class IonSelectValueAccessorDirective implements ControlValueAccessor {