diff --git a/src/material/button/button-base.ts b/src/material/button/button-base.ts index 025d0528cb42..656533c3a5d4 100644 --- a/src/material/button/button-base.ts +++ b/src/material/button/button-base.ts @@ -37,33 +37,33 @@ export const MAT_BUTTON_HOST = { }; /** List of classes to add to buttons instances based on host attribute selector. */ -const HOST_SELECTOR_MDC_CLASS_PAIR: {selector: string; mdcClasses: string[]}[] = [ +const HOST_SELECTOR_MDC_CLASS_PAIR: {attribute: string; mdcClasses: string[]}[] = [ { - selector: 'mat-button', + attribute: 'mat-button', mdcClasses: ['mdc-button', 'mat-mdc-button'], }, { - selector: 'mat-flat-button', + attribute: 'mat-flat-button', mdcClasses: ['mdc-button', 'mdc-button--unelevated', 'mat-mdc-unelevated-button'], }, { - selector: 'mat-raised-button', + attribute: 'mat-raised-button', mdcClasses: ['mdc-button', 'mdc-button--raised', 'mat-mdc-raised-button'], }, { - selector: 'mat-stroked-button', + attribute: 'mat-stroked-button', mdcClasses: ['mdc-button', 'mdc-button--outlined', 'mat-mdc-outlined-button'], }, { - selector: 'mat-fab', + attribute: 'mat-fab', mdcClasses: ['mdc-fab', 'mat-mdc-fab'], }, { - selector: 'mat-mini-fab', + attribute: 'mat-mini-fab', mdcClasses: ['mdc-fab', 'mdc-fab--mini', 'mat-mdc-mini-fab'], }, { - selector: 'mat-icon-button', + attribute: 'mat-icon-button', mdcClasses: ['mdc-icon-button', 'mat-mdc-icon-button'], }, ]; @@ -128,15 +128,14 @@ export class MatButtonBase implements AfterViewInit, OnDestroy { className: 'mat-mdc-button-ripple', }); - const classList = (_elementRef.nativeElement as HTMLElement).classList; + const element = this._elementRef.nativeElement; + const classList = (element as HTMLElement).classList; // For each of the variant selectors that is present in the button's host // attributes, add the correct corresponding MDC classes. - for (const pair of HOST_SELECTOR_MDC_CLASS_PAIR) { - if (this._hasHostAttributes(pair.selector)) { - pair.mdcClasses.forEach((className: string) => { - classList.add(className); - }); + for (const {attribute, mdcClasses} of HOST_SELECTOR_MDC_CLASS_PAIR) { + if (element.hasAttribute(attribute)) { + classList.add(...mdcClasses); } } } @@ -158,11 +157,6 @@ export class MatButtonBase implements AfterViewInit, OnDestroy { } } - /** Gets whether the button has one of the given attributes. */ - private _hasHostAttributes(...attributes: string[]) { - return attributes.some(attribute => this._elementRef.nativeElement.hasAttribute(attribute)); - } - private _updateRippleDisabled(): void { this._rippleLoader?.setDisabled( this._elementRef.nativeElement,