From 3e9427bada0c0537779a534a19ef58aef209a348 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Thu, 12 Jan 2017 17:37:00 -0500 Subject: [PATCH] feat(radio): add disabled to radio-group and support disabled formcontrol fixes #9998 --- src/components/radio/radio-button.ts | 6 ++++- src/components/radio/radio-group.ts | 27 +++++++++++++++++-- src/components/radio/test/basic/app-module.ts | 5 ++++ src/components/radio/test/basic/main.html | 26 ++++++++++++++++++ 4 files changed, 61 insertions(+), 3 deletions(-) diff --git a/src/components/radio/radio-button.ts b/src/components/radio/radio-button.ts index 959338790d8..f954122f355 100644 --- a/src/components/radio/radio-button.ts +++ b/src/components/radio/radio-button.ts @@ -173,7 +173,7 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit */ @Input() get disabled(): boolean { - return this._disabled; + return this._disabled || (this._group != null && this._group.disabled); } set disabled(val: boolean) { this._disabled = isTrueProperty(val); @@ -207,6 +207,10 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit if (this._group && isPresent(this._group.value)) { this.checked = isCheckedProperty(this._group.value, this.value); } + + if (this._group && this._group.disabled) { + this.disabled = this._group.disabled; + } } /** diff --git a/src/components/radio/radio-group.ts b/src/components/radio/radio-group.ts index 1088076f112..253e48cb6c2 100644 --- a/src/components/radio/radio-group.ts +++ b/src/components/radio/radio-group.ts @@ -1,8 +1,8 @@ -import { ChangeDetectorRef, ContentChild, Directive, ElementRef, EventEmitter, forwardRef, Output, Renderer } from '@angular/core'; +import { ChangeDetectorRef, ContentChild, Directive, ElementRef, EventEmitter, forwardRef, Input, Output, Renderer } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { ListHeader } from '../list/list-header'; -import { isCheckedProperty } from '../../util/util'; +import { isCheckedProperty, isTrueProperty } from '../../util/util'; import { RadioButton } from './radio-button'; export const RADIO_VALUE_ACCESSOR: any = { @@ -71,6 +71,11 @@ export const RADIO_VALUE_ACCESSOR: any = { }) export class RadioGroup { + /** + * @internal + */ + _disabled: boolean = false; + /** * @private */ @@ -101,6 +106,17 @@ export class RadioGroup { */ id: number; + /** + * @input {boolean} Whether all radio buttons in the group should be disabled. Default false. + */ + @Input() + get disabled(): boolean { + return this._disabled; + } + set disabled(val: boolean) { + this._disabled = isTrueProperty(val); + } + /** * @output {any} expression to be evaluated when selection has been changed */ @@ -248,6 +264,13 @@ export class RadioGroup { */ onTouched() {} + /** + * @private + */ + setDisabledState(isDisabled: boolean) { + this.disabled = isDisabled; + } + } let radioGroupIds = -1; diff --git a/src/components/radio/test/basic/app-module.ts b/src/components/radio/test/basic/app-module.ts index 24822d7a438..35fc3a17dad 100644 --- a/src/components/radio/test/basic/app-module.ts +++ b/src/components/radio/test/basic/app-module.ts @@ -18,6 +18,11 @@ export class E2EPage { 'fruitsCtrl': this.fruitsCtrl }); + friendsCtrl = new FormControl({value: 'enemies', disabled: true}); + friendsForm = new FormGroup({ + 'friendsCtrl': this.friendsCtrl + }); + currenciesControl = new FormControl('EUR'); currencyForm = new FormGroup({ 'currenciesControl': this.currenciesControl diff --git a/src/components/radio/test/basic/main.html b/src/components/radio/test/basic/main.html index f52c56e5d3a..9fd1245521b 100644 --- a/src/components/radio/test/basic/main.html +++ b/src/components/radio/test/basic/main.html @@ -142,4 +142,30 @@ + + Disabled radio-group + + Friends + + + + Enemies + + + + +
+ + Disabled formGroup + + Friends + + + + Enemies + + + +
+