Bug

Conventionally (html), and all tags are enabled unless explicitly disabled

• In the example below, the md-menu-item is not explicitly disabled yet not clickable.

    // in option.component.ts
   get visibleOptions() {
    return [
      {
        name: 'Login',
        path: '/access/login',
        icon: 'fingerprint',
      },
      ...
    ]
    ...
 }

<-- in option.component.html !-->
<button  md-icon-button class="menu md-icon-button" [mdMenuTriggerFor]="optionMenu">
    <md-iconmore_vert</md-icon>
</button>

<md-menu #optionMenu="mdMenu">
  <a md-menu-item *ngFor="let option of visibleOptions" [routerLink]="[option.path]">
    <md-icon>{{option.icon}}</md-icon>
    <span>{{option.name}}</span>
  </a>
</md-menu>

• In the example below: the disabled attribute is set to undefined which should disable the item as per the source code here. It is not disabled and not clickable either.

  <a md-menu-item
      *ngFor="let option of visibleOptions"
      [routerLink]="[option.path]"
      [disabled]="option.disabled">...</a>

• In the example below: the disabled attribute is set to false. The item is not disabled, and not clickable.

  <a md-menu-item
      *ngFor="let option of visibleOptions"
      [routerLink]="[option.path]"
      [disabled]="false">...</a>

• In the example below: the disabled attribute is set to true. The item is disabled, and is clickable.

  <a md-menu-item
      *ngFor="let option of visibleOptions"
      [routerLink]="[option.path]"
      [disabled]="true">...</a>

• In the example below: the disabled attribute is set to null. The item is disabled, and is clickable.

  <a md-menu-item
      *ngFor="let option of visibleOptions"
      [routerLink]="[option.path]"
      [disabled]="null">...</a>

What is the expected behavior?

We will benefit from setting the default value of the _disabled field of the class to false. here.

Then we can allow overwriting as per this line.

Then we class can properly stop propagating a click event as per this line.

What is the current behavior?

The current behavior as per 1.0.0-Beta-1 is not correct and consistent. Enabled menu-items are not clickable. But the disabled one(s) are.

What are the steps to reproduce?

http://embed.plnkr.co/gcJw7FFOMg2RKD5sSx5g/

What is the use-case or motivation for changing an existing behavior?

Unless I disable something, it should be enabled by default. Disabling clicks and preventing them from propagating should also work.

Changing this line to the following may be the right approach.

  _disabled = false;

Changing this setter to the following may be the right approach.

  set disabled(value: boolean) {
    this._disabled = value === true || false;
  }

Which versions of Angular, Material, OS, browsers are affected?

@angular/cli: 1.0.0-beta.30
node: 6.9.5
os: darwin x64 (Sierra)
@angular/common: 2.4.6
@angular/compiler: 2.4.6
@angular/core: 2.4.6
@angular/forms: 2.4.6
@angular/http: 2.4.6
@angular/material: 2.0.0-beta.1
@angular/platform-browser: 2.4.6
@angular/platform-browser-dynamic: 2.4.6
@angular/router: 3.4.6
@angular/cli: 1.0.0-beta.30
@angular/compiler-cli: 2.4.6
Chrome: latest.