diff --git a/src/components/alert/alert-component.ts b/src/components/alert/alert-component.ts index 1af274fc6be..0c6efc661c7 100644 --- a/src/components/alert/alert-component.ts +++ b/src/components/alert/alert-component.ts @@ -103,7 +103,8 @@ export class AlertCmp { if (this.d.cssClass) { this.d.cssClass.split(' ').forEach(cssClass => { - renderer.setElementClass(_elementRef.nativeElement, cssClass, true); + // Make sure the class isn't whitespace, otherwise it throws exceptions + if (cssClass.trim() !== '') renderer.setElementClass(_elementRef.nativeElement, cssClass, true); }); } diff --git a/src/components/select/select.ts b/src/components/select/select.ts index 3525c145c9a..4b584484b0a 100644 --- a/src/components/select/select.ts +++ b/src/components/select/select.ts @@ -301,18 +301,23 @@ export class Select implements AfterContentInit, ControlValueAccessor, OnDestroy }; }); + var selectCssClass = 'select-alert'; + // create the alert instance from our built up alertOptions overlay = new Alert(this._app, alertOptions); if (this._multi) { // use checkboxes - overlay.setCssClass('select-alert multiple-select-alert'); - + selectCssClass += ' multiple-select-alert'; } else { // use radio buttons - overlay.setCssClass('select-alert single-select-alert'); + selectCssClass += ' single-select-alert'; } + // If the user passed a cssClass for the select, add it + selectCssClass += alertOptions.cssClass ? ' ' + alertOptions.cssClass : ''; + overlay.setCssClass(selectCssClass); + overlay.addButton({ text: this.okText, handler: (selectedValues: any) => { diff --git a/src/components/select/test/single-value/index.ts b/src/components/select/test/single-value/index.ts index 35c326d11e8..af1967ffba1 100644 --- a/src/components/select/test/single-value/index.ts +++ b/src/components/select/test/single-value/index.ts @@ -30,7 +30,8 @@ class E2EPage { this.musicAlertOpts = { title: '1994 Music', - subTitle: 'Select your favorite' + subTitle: 'Select your favorite', + cssClass: 'music-select' }; }