Material: md-colors is broken with default theme in dialog

[mohammadrafigh]

Actual Behavior:

• What is the issue? *

using md-colors with default theme inside dialog throws this in 1.1.3:
mdColors: couldn't find '' in the palettes.

• What is the expected behavior?
  the default color palette should be applied with warning color.

CodePen (or steps to reproduce the issue): *

CodePen

Angular Versions: *

• Angular Version: 1.3.20, 1.5.8, 1.5.11
• Angular Material Version: release: version 1.1.3

Additional Information:

• Browser Type: * Chromium
• Browser Version: * 55.0.2883.87
• OS: * Ubuntu 16.10
• Stack Traces: mdColors: couldn't find '' in the palettes.

[Schweigi]

It's definitely broken since Angular-Mateiral v1.1.3. Adding the term default as prefix to the color will work as a workaround in the meantime.

Example:
md-colors="{color:'warn'}" => md-colors="{color:'default-warn'}"

[jbabaei]

Excellent. very good

[kylekatarnls]

If it can help to debug, I added a breakpoint here:

    function applyThemeColors(element, colorExpression) {
      try {
        if (colorExpression) {
          // Assign the calculate RGBA color values directly as inline CSS
           element.css(interpolateColors(colorExpression));
        }
      } catch (e) {
        $log.error(e.message);
      }

    }

colorExpression = primary in the page.
colorExpression = -primary in the dialog.

[codymikol]

~This is definitely still an issue, any updates on this?~

I actually figured out how this can be fixed, I'm looking into making a PR now

[codymikol]

I made a PR https://github.com/angular/material/pull/11078

For anyone looking for a workaround to this issue, if you set the md-theme property inside of your dialog content to either default or the specific theme you want to use, this will stop md-colors from breaking.

[Splaktar]

Updated CodePen for 1.1.7. Issue still occurs.

[thorvx]

Same issue.

Related issue: https://github.com/angular/material/issues/525

[Splaktar]

The PR to fix this is going through the presubmit process (there was unfortunately a delay in that process) and then hopefully it will pass and be able to be merged.

[akvaliya]

@Splaktar Is this issue resolved yet? I am facing it when dynamic theme is generated.

[codymikol]

@akvaliya This was fixed in 1.1.8

[garretwilson]

I just ran into this with AngularJS 1.6.4. "{color:'accent'}" seems to work on the main page, but in an mdDialog I had to use "{color:'default-accent'}" to get it to work.

[Splaktar]

@garretwilson which version of AngularJS Material are you using?

[Splaktar]

@garretwilson this is fixed in 1.1.8. Here's the CodePen above updated for 1.1.8 that shows this working without the need to add default-.

[garretwilson]

Ah, I'm using 1.1.3. Thanks for the info; we'll update in our next iteration.

[garretwilson]

Yep, v1.1.8 seems to have fixed it, thanks.