vicb · Dec 9, 2015
diff --git a/modules/angular2/src/core/linker/view.ts b/modules/angular2/src/core/linker/view.ts
@@ -156,8 +156,7 @@ export class AppView implements ChangeDispatcher, RenderEventDispatcher {
       if (b.isElementProperty()) {
         this.renderer.setElementProperty(elementRef, b.name, currentValue);
       } else if (b.isElementAttribute()) {
-        this.renderer.setElementAttribute(elementRef, b.name,
-                                          isPresent(currentValue) ? `${currentValue}` : null);
+        this.renderer.setElementAttribute(elementRef, b.name, currentValue);
       } else if (b.isElementClass()) {
         this.renderer.setElementClass(elementRef, b.name, currentValue);
       } else if (b.isElementStyle()) {

diff --git a/modules/angular2/src/core/render/api.ts b/modules/angular2/src/core/render/api.ts
@@ -294,11 +294,9 @@ export abstract class Renderer {
 
   /**
    * Sets an attribute on the Element specified via `location`.
-   *
-   * If `attributeValue` is `null`, the attribute is removed.
    */
   abstract setElementAttribute(location: RenderElementRef, attributeName: string,
-                               attributeValue: string);
+                               attributeValue: any);
 
   /**
    * Sets a (CSS) class on the Element specified via `location`.

diff --git a/modules/angular2/src/platform/dom/dom_renderer.ts b/modules/angular2/src/platform/dom/dom_renderer.ts
@@ -135,11 +135,12 @@ export abstract class DomRenderer extends Renderer implements NodeFactory<Node>
   }
 
   setElementAttribute(location: RenderElementRef, attributeName: string,
-                      attributeValue: string): void {
+                      attributeValue: any): void {
     var view = resolveInternalDomView(location.renderView);
     var element = view.boundElements[location.boundElementIndex];
-    if (isPresent(attributeValue)) {
-      DOM.setAttribute(element, attributeName, stringify(attributeValue));
+    if (isPresent(attributeValue) && attributeValue !== false) {
+      DOM.setAttribute(element, attributeName,
+                       attributeValue === true ? '' : stringify(attributeValue));
     } else {
       DOM.removeAttribute(element, attributeName);
     }

diff --git a/modules/angular2/src/web_workers/worker/renderer.ts b/modules/angular2/src/web_workers/worker/renderer.ts
@@ -186,7 +186,7 @@ export class WebWorkerRenderer implements Renderer {
   /**
    * Sets an attribute on an element.
    */
-  setElementAttribute(location: RenderElementRef, attributeName: string, attributeValue: string) {
+  setElementAttribute(location: RenderElementRef, attributeName: string, attributeValue: any) {
     var fnArgs = [
       new FnArg(location, WebWorkerElementRef),
       new FnArg(attributeName, null),

diff --git a/modules/angular2/test/platform/dom/dom_renderer_integration_spec.ts b/modules/angular2/test/platform/dom/dom_renderer_integration_spec.ts
@@ -10,25 +10,49 @@ import {
   it,
   xit,
   beforeEachProviders,
-  SpyObject,
+  TestComponentBuilder,
 } from 'angular2/testing_internal';
 
-// import {MapWrapper} from 'angular2/src/facade/collection';
-// import {DOM} from 'angular2/src/platform/dom/dom_adapter';
+import {Component, ViewMetadata} from 'angular2/src/core/metadata';
 
-// import {DomTestbed, TestRootView, elRef} from './dom_testbed';
-
-// import {
-//   ViewDefinition,
-//   RenderDirectiveMetadata,
-//   RenderViewRef,
-//   ViewEncapsulation
-// } from 'angular2/src/core/render/api';
+import {DOM} from 'angular2/src/platform/dom/dom_adapter';
 
 export function main() {
   describe('DomRenderer integration', () => {
-    it('should work', () => {
-                          // TODO
-                      });
+
+    describe('attribute', () => {
+
+      it('should handle boolean attributes',
+         inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
+           tcb.overrideView(MyCmp, new ViewMetadata({template: '<p [attr.myattr]="value"></p>'}))
+               .createAsync(MyCmp)
+               .then((fixture) => {
+                 let cmp = fixture.debugElement.componentInstance;
+                 let pEl = DOM.firstChild(fixture.debugElement.nativeElement);
+
+                 cmp.value = "some string";
+                 fixture.detectChanges();
+                 expect(DOM.getAttribute(pEl, 'myattr')).toEqual('some string');
+
+                 cmp.value = true;
+                 fixture.detectChanges();
+                 expect(DOM.hasAttribute(pEl, 'myattr')).toEqual(true);
+                 expect(DOM.getAttribute(pEl, 'myattr')).toEqual('');
+
+                 cmp.value = false;
+                 fixture.detectChanges();
+                 expect(DOM.hasAttribute(pEl, 'myattr')).toEqual(false);
+
+                 async.done();
+               });
+         }));
+
+    });
+
   });
 }
+
+@Component({selector: 'my-cmp', inputs: ['value']})
+class MyCmp {
+  value: any;
+}
diff --git a/modules/angular2_material/src/components/button/button.ts b/modules/angular2_material/src/components/button/button.ts
@@ -57,7 +57,7 @@ export class MdButton {
     '(blur)': 'onBlur()',
     '[tabIndex]': 'tabIndex',
     '[class.md-button-focus]': 'isKeyboardFocused',
-    '[attr.aria-disabled]': 'isAriaDisabled',
+    '[attr.aria-disabled]': 'disabled?.toString()',
   },
 })
 @View({
@@ -89,9 +89,4 @@ export class MdAnchor extends MdButton implements OnChanges {
     // A disabled anchor should not be in the tab flow.
     this.tabIndex = this.disabled ? -1 : 0;
   }
-
-  /** Gets the aria-disabled value for the component, which must be a string for Dart. */
-  get isAriaDisabled(): string {
-    return this.disabled ? 'true' : 'false';
-  }
 }
diff --git a/modules/angular2_material/src/components/checkbox/checkbox.ts b/modules/angular2_material/src/components/checkbox/checkbox.ts
@@ -9,8 +9,8 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
   inputs: ['checked', 'disabled'],
   host: {
     'role': 'checkbox',
-    '[attr.aria-checked]': 'checked',
-    '[attr.aria-disabled]': 'disabled',
+    '[attr.aria-checked]': 'checked?.toString()',
+    '[attr.aria-disabled]': 'disabled?.toString()',
     '[tabindex]': 'tabindex',
     '(keydown)': 'onKeydown($event)',
   }

diff --git a/modules/angular2_material/src/components/radio/radio_button.ts b/modules/angular2_material/src/components/radio/radio_button.ts
@@ -37,7 +37,7 @@ var _uniqueIdCounter: number = 0;
   inputs: ['disabled', 'value'],
   host: {
     'role': 'radiogroup',
-    '[attr.aria-disabled]': 'disabled',
+    '[attr.aria-disabled]': 'disabled?.toString()',
     '[attr.aria-activedescendant]': 'activedescendant',
     // TODO(jelbourn): Remove ^ when event retargeting is fixed.
     '(keydown)': 'onKeydown($event)',
@@ -195,8 +195,8 @@ export class MdRadioGroup implements OnChanges {
     'role': 'radio',
     '[id]': 'id',
     '[tabindex]': 'tabindex',
-    '[attr.aria-checked]': 'checked',
-    '[attr.aria-disabled]': 'disabled',
+    '[attr.aria-checked]': 'checked?.toString()',
+    '[attr.aria-disabled]': 'disabled?.toString()',
     '(keydown)': 'onKeydown($event)',
   }
 })

diff --git a/modules/angular2_material/src/components/switcher/switch.ts b/modules/angular2_material/src/components/switcher/switch.ts
@@ -9,8 +9,8 @@ import {MdCheckbox} from "../checkbox/checkbox";
   inputs: ['checked', 'disabled'],
   host: {
     'role': 'checkbox',
-    '[attr.aria-checked]': 'checked',
-    '[attr.aria-disabled]': 'disabled_',
+    '[attr.aria-checked]': 'checked?.toString()',
+    '[attr.aria-disabled]': 'disabled_?.toString()',
     '(keydown)': 'onKeydown($event)',
   }
 })