colors: add support for null or undefined values

[alirezamirian]

Bug or maybe enhancement request:

md-colors directive throws error when property values evaluate to null or undefined. Handling null or undefined is particularly useful when expression is controlled by some nullable user input.

Currently it not logs an error in the console, but also fails to correctly clean previous styles when going from some value to undefined or null.

CodePen and steps to reproduce the issue:

CodePen Demo which demonstrates the issue:

Detailed Reproduction Steps:

1. Select a color from color selection control
2. Select none

What is the expected behavior?

md-colors should gracefully handle null or undefined. It should not log error in the console, and also it should clean previous styles when going from a valid color to null/undefined

What is the current behavior?

It logs lots of errors in the console and doesn't clean previous styles properly.

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

All use cases when values are not static strings and are dynamically evaluated and can may be nullable.

Which versions of AngularJS, Material, OS, and browsers are affected?

• AngularJS: any (not relevant)
• AngularJS Material: 1.1.13 (latest at the time)
• OS: any
• Browsers: any

Is there anything else we should know? Stack Traces, Screenshots, etc.

No

[Splaktar]

OK, in the CodePen demo I see "Cannot read property 'split' of null" in the console so I get that part of this report.

When I select None, you are expecting that the text turns back to black along with the background being white?

[jazdw]

I generally work around this by using something like this, not ideal obviously.

<div md-colors="accent ? {color: 'accent'} : {}">Test test</div>