diff --git a/src/buttons/button-radio.directive.ts b/src/buttons/button-radio.directive.ts index 6e3806b523..ff6d4a9f31 100644 --- a/src/buttons/button-radio.directive.ts +++ b/src/buttons/button-radio.directive.ts @@ -1,5 +1,12 @@ import { - Directive, ElementRef, HostBinding, forwardRef, HostListener, Input, OnInit, ChangeDetectorRef + Directive, + ElementRef, + HostBinding, + forwardRef, + HostListener, + Input, + OnInit, + ChangeDetectorRef } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; @@ -41,12 +48,17 @@ export class ButtonRadioDirective implements ControlValueAccessor, OnInit { if (this.uncheckable && this.btnRadio === this.value) { this.value = undefined; - } else { - this.value = this.btnRadio; + this.onTouched(); + this.onChange(this.value); + return; } - this.onTouched(); - this.onChange(this.value); + if (this.btnRadio !== this.value) { + this.value = this.btnRadio; + this.onTouched(); + this.onChange(this.value); + return; + } } public constructor(el: ElementRef, private cdr: ChangeDetectorRef) { diff --git a/src/spec/button.directive.spec.ts b/src/spec/button.directive.spec.ts index e3dcdf244c..08fe1949dd 100644 --- a/src/spec/button.directive.spec.ts +++ b/src/spec/button.directive.spec.ts @@ -491,6 +491,21 @@ describe('Directive: Buttons', () => { expect(btn.children[3].classList).not.toContain('active'); })); + it('should not toggle when click in active button without uncheckable', () => { + fixture = createComponent(html, 'OnPush'); + context = fixture.componentInstance; + element = fixture.nativeElement; + + let btn = element.querySelector('.btn-group.radio'); + expect(context.radioModel).toEqual('Middle'); + + (btn.children[1] as HTMLElement).click(); + fixture.detectChanges(); + expect(btn.children[0].classList).not.toContain('active'); + expect(btn.children[1].classList).toContain('active'); + expect(btn.children[2].classList).not.toContain('active'); + }); + it('should unset active class via click', () => { fixture = createComponent(html); context = fixture.componentInstance;