Add support for [hidden] to md-button

[Splaktar]

• Do you want to request a feature or report a bug?
  feature
• What is the current behavior?
  [hidden] is ignored in both anchor and button mode.
• If the current behavior is a bug,
  please provide steps to reproduce and if possible a minimal demo of the problem:
  http://plnkr.co/edit/ZULwBrp3fHLorUSedYrt?p=preview
• What is the expected behavior?
  Button should be hidden when expression evaluates to true.
• What is the motivation / use case for changing the behavior?
  Standard feature request.
• Which version of Angular and Material, and which browser and OS does this issue affect?
  Did this work in previous versions of Angular / Material?
  Please also test with the latest stable and snapshot versions.
  Chrome. "@angular2-material/button": "2.0.0-alpha.4",
• Workaround
  Custom CSS:

[hidden][md-button] {
  display: none;
}

[devversion]

I would like to fix that, by removing the display property on the button-base.

• Normally the user-agent uses display: inline-block on the button by default, but I imagine, the display property was added intentionally.

[jelbourn]

We actually consider using the hidden property to be an anti-pattern due to its very poor implementation in browsers and want to recommend that devs either use ngIf or hide elements using a css class.
Kara actually blogged about this topic recently.

Alternatively, you could add

[hidden] {
  display: none !important; 
}

to your own applications, which is similar to what Angular 1 did with ng-hide.

[Splaktar]

Good to know Jeremy. Thank you!

[Hainesy]

ngIf causes problems when trying to use ViewChild in the component class.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}