fix(NgClass): ignore empty and blank class names
Fixes #4033 Closes #4173
This commit is contained in:
parent
5bab607f44
commit
73351ac00f
|
@ -126,6 +126,9 @@ export class NgClass implements DoCheck, OnDestroy {
|
|||
}
|
||||
|
||||
private _toggleClass(className: string, enabled): void {
|
||||
this._renderer.setElementClass(this._ngEl, className, enabled);
|
||||
className = className.trim();
|
||||
if (className.length > 0) {
|
||||
this._renderer.setElementClass(this._ngEl, className, enabled);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -218,6 +218,36 @@ export function main() {
|
|||
rootTC.debugElement.componentInstance.arrExpr = ['bar'];
|
||||
detectChangesAndCheck(rootTC, 'ng-binding foo bar');
|
||||
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should ignore empty or blank class names',
|
||||
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
|
||||
var template = '<div class="foo" [ng-class]="arrExpr"></div>';
|
||||
|
||||
tcb.overrideTemplate(TestComponent, template)
|
||||
.createAsync(TestComponent)
|
||||
.then((rootTC) => {
|
||||
|
||||
rootTC.debugElement.componentInstance.arrExpr = ['', ' '];
|
||||
detectChangesAndCheck(rootTC, 'foo ng-binding');
|
||||
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should trim blanks from class names',
|
||||
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
|
||||
var template = '<div class="foo" [ng-class]="arrExpr"></div>';
|
||||
|
||||
tcb.overrideTemplate(TestComponent, template)
|
||||
.createAsync(TestComponent)
|
||||
.then((rootTC) => {
|
||||
|
||||
rootTC.debugElement.componentInstance.arrExpr = [' bar '];
|
||||
detectChangesAndCheck(rootTC, 'foo ng-binding bar');
|
||||
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
@ -289,6 +319,20 @@ export function main() {
|
|||
});
|
||||
}));
|
||||
|
||||
it('should ignore empty and blank strings',
|
||||
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
|
||||
var template = `<div class="foo" [ng-class]="strExpr"></div>`;
|
||||
|
||||
tcb.overrideTemplate(TestComponent, template)
|
||||
.createAsync(TestComponent)
|
||||
.then((rootTC) => {
|
||||
rootTC.debugElement.componentInstance.strExpr = '';
|
||||
detectChangesAndCheck(rootTC, 'foo ng-binding');
|
||||
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
describe('cooperation with other class-changing constructs', () => {
|
||||
|
|
Loading…
Reference in New Issue