0

I'm trying to integrate Material Design Lite @angular-mdl/core into the Angular project, but it doesn't works as expected. Namely, in my example there is basic button element which includes ripple effect:

<button mdl-button 
        mdl-button-type="raised" 
        mdl-colored="accent" 
        mdl-ripple>Button</button>

Although the ripple effect works in official documentation page example, in my example it's not working. I even tried to follow the orders of attributes from the documentation. Still no luck.

What kind of magic I'm missing or doing wrong?

Any help would be appreciated!

Playground: https://stackblitz.com/edit/angular-ivy-pbzzmm

Docs: https://mseemann.io/angular2-mdl/button

Roy
  • 7,811
  • 4
  • 24
  • 47
bofanda
  • 10,386
  • 8
  • 34
  • 57
  • I think you're doing the right thing, but the spans for the ripple are not being added to the HTML. – Roy Jul 11 '20 at 20:37
  • @Roy, Any ideas on how to resolve those not being added spans? – bofanda Jul 13 '20 at 20:13
  • I tried it with v8 of MDL, but still the ripple's spans are not being added. See [this StackBlitz](https://stackblitz.com/edit/angular-9-starter-material-hgtauw?file=src%2Fapp%2Fapp.component.html). I think the best thing to do is to file a bug on GitHub. – Roy Jul 13 '20 at 20:49
  • 1
    @Roy, Done. Let's see if contributor will provide us with a solution. https://github.com/mseemann/angular2-mdl/issues/1847 – bofanda Jul 13 '20 at 21:36

0 Answers0