diff --git a/modules/angular2/src/core/linker/view.ts b/modules/angular2/src/core/linker/view.ts index 44c5058079..e0e1569de3 100644 --- a/modules/angular2/src/core/linker/view.ts +++ b/modules/angular2/src/core/linker/view.ts @@ -162,7 +162,8 @@ export class AppView implements ChangeDispatcher, RenderEventDispatcher { this.renderer.setElementClass(elementRef, b.name, currentValue); } else if (b.isElementStyle()) { var unit = isPresent(b.unit) ? b.unit : ''; - this.renderer.setElementStyle(elementRef, b.name, `${currentValue}${unit}`); + this.renderer.setElementStyle(elementRef, b.name, + isPresent(currentValue) ? `${currentValue}${unit}` : null); } else { throw new BaseException('Unsupported directive record'); } diff --git a/modules/angular2/test/core/linker/integration_spec.ts b/modules/angular2/test/core/linker/integration_spec.ts index b663f7f890..3274432085 100644 --- a/modules/angular2/test/core/linker/integration_spec.ts +++ b/modules/angular2/test/core/linker/integration_spec.ts @@ -193,6 +193,30 @@ export function main() { }); })); + it('should remove style when when style expression evaluates to null', + inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { + tcb.overrideView(MyComp, + new ViewMetadata({template: '
'})) + + .createAsync(MyComp) + .then((fixture) => { + + fixture.debugElement.componentInstance.ctxProp = '10'; + fixture.detectChanges(); + expect(DOM.getStyle(fixture.debugElement.componentViewChildren[0].nativeElement, + 'height')) + .toEqual('10px'); + + fixture.debugElement.componentInstance.ctxProp = null; + fixture.detectChanges(); + expect(DOM.getStyle(fixture.debugElement.componentViewChildren[0].nativeElement, + 'height')) + .toEqual(''); + + async.done(); + }); + })); + it('should consume binding to property names where attr name and property name do not match', inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => { tcb.overrideView(MyComp,