diff --git a/components/radio/nz-radio-group.component.ts b/components/radio/nz-radio-group.component.ts index 380b3b6889f..45c683fa98d 100644 --- a/components/radio/nz-radio-group.component.ts +++ b/components/radio/nz-radio-group.component.ts @@ -7,6 +7,8 @@ import { Input } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; +import { isNotNil } from '../core/util/check'; +import { toBoolean } from '../core/util/convert'; export type NzRadioGroupSizeType = 'large' | 'default' | 'small'; @@ -31,7 +33,7 @@ import { NzRadioComponent } from './nz-radio.component'; export class NzRadioGroupComponent implements AfterContentInit, ControlValueAccessor { private _size: NzRadioGroupSizeType = 'default'; private _name: string; - private _disabled: boolean = false; + private _disabled: boolean; el: HTMLElement; value: string; @@ -52,7 +54,7 @@ export class NzRadioGroupComponent implements AfterContentInit, ControlValueAcce @Input() set nzDisabled(value: boolean) { - this._disabled = value; + this._disabled = toBoolean(value); this.updateDisabledState(); } @@ -71,9 +73,11 @@ export class NzRadioGroupComponent implements AfterContentInit, ControlValueAcce } updateDisabledState(): void { - this.radios.forEach((radio) => { - radio.nzDisabled = this.nzDisabled; - }); + if (isNotNil(this.nzDisabled)) { + this.radios.forEach((radio) => { + radio.nzDisabled = this.nzDisabled; + }); + } } updateChildrenName(): void { diff --git a/components/radio/nz-radio.spec.ts b/components/radio/nz-radio.spec.ts index b535771e857..c355f79a0c2 100644 --- a/components/radio/nz-radio.spec.ts +++ b/components/radio/nz-radio.spec.ts @@ -167,7 +167,7 @@ describe('radio', () => { radios = fixture.debugElement.queryAll(By.directive(NzRadioButtonComponent)); radioGroup = fixture.debugElement.query(By.directive(NzRadioGroupComponent)); }); - it('should disable work', fakeAsync(() => { + it('should group disable work', fakeAsync(() => { fixture.detectChanges(); expect(testComponent.value).toBe('A'); radios[ 1 ].nativeElement.click(); @@ -177,6 +177,19 @@ describe('radio', () => { expect(radios[ 1 ].nativeElement.firstElementChild.classList).not.toContain('ant-radio-button-checked'); expect(testComponent.value).toBe('A'); })); + it('should single disable work', fakeAsync(() => { + testComponent.disabled = false; + fixture.detectChanges(); + testComponent.singleDisabled = true; + fixture.detectChanges(); + expect(testComponent.value).toBe('A'); + radios[ 2 ].nativeElement.click(); + fixture.detectChanges(); + flush(); + fixture.detectChanges(); + expect(radios[ 2 ].nativeElement.firstElementChild.classList).not.toContain('ant-radio-button-checked'); + expect(testComponent.value).toBe('A'); + })); }); describe('radio form', () => { let fixture; @@ -238,11 +251,11 @@ describe('radio', () => { it('should set disabled work', fakeAsync(() => { flush(); expect(testComponent.formGroup.get('radioGroup').value).toBe('B'); - radios[0].nativeElement.click(); + radios[ 0 ].nativeElement.click(); fixture.detectChanges(); expect(testComponent.formGroup.get('radioGroup').value).toBe('A'); testComponent.disable(); - radios[1].nativeElement.click(); + radios[ 1 ].nativeElement.click(); fixture.detectChanges(); expect(testComponent.formGroup.get('radioGroup').value).toBe('A'); })); @@ -340,13 +353,15 @@ export class NzTestRadioGroupFormComponent { } /** https://github.com/NG-ZORRO/ng-zorro-antd/issues/1543 **/ +/** https://github.com/NG-ZORRO/ng-zorro-antd/issues/1734 **/ + @Component({ selector: 'nz-test-radio-group-disabled', template: ` - + ` }) @@ -356,4 +371,5 @@ export class NzTestRadioGroupDisabledComponent { value = 'A'; disabled = true; name: string; + singleDisabled = false; }