diff --git a/modules/angular2/src/render/dom/dom_renderer.ts b/modules/angular2/src/render/dom/dom_renderer.ts index 3b2dbb2896..602b810285 100644 --- a/modules/angular2/src/render/dom/dom_renderer.ts +++ b/modules/angular2/src/render/dom/dom_renderer.ts @@ -147,7 +147,7 @@ export class DomRenderer extends Renderer { // Reflect the property value as an attribute value with ng-reflect- prefix. if (this._reflectPropertiesAsAttributes) { this.setElementAttribute(location, `${REFLECT_PREFIX}${camelCaseToDashCase(propertyName)}`, - propertyValue); + `${propertyValue}`); } } diff --git a/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts b/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts index b6c2f0c957..b64284c73e 100644 --- a/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts +++ b/modules/angular2/test/render/dom/dom_renderer_integration_spec.ts @@ -146,6 +146,26 @@ export function main() { async.done(); }); })); + + it('should reflect non-string property values as attributes if flag is set', + inject([AsyncTestCompleter, DomTestbed], (async, tb) => { + tb.compileAndMerge(someComponent, + [ + new ViewDefinition({ + componentId: 'someComponent', + template: '', + directives: [] + }) + ]) + .then((protoViewMergeMappings) => { + var rootView = tb.createView(protoViewMergeMappings); + var el = DOM.childNodes(rootView.hostElement)[0]; + tb.renderer.setElementProperty(elRef(rootView.viewRef, 1), 'maxLength', 20); + expect(DOM.getAttribute(el, 'ng-reflect-max-length')) + .toEqual('20'); + async.done(); + }); + })); }); if (DOM.supportsDOMEvents()) {