search

angular / material-icons

Common resources for material design in AngularJS
67 stars 21 forks source link

Syntax for use #2

Open simonh1000 opened 10 years ago

simonh1000 commented 10 years ago

Would be great to have a couple of hints on syntax: e.g. <material-icon icon="icons/ic_access_time_24px.svg"></material-icon> does not work :-(

ghost commented 10 years ago

Yep, i'm wondering how to use this yet....

ghost commented 10 years ago

+1

junaidurfjd commented 10 years ago

Give the url for any .svg file in the icon attribute.. :)

ghost commented 10 years ago

Well, here I've prepared a fiddle trying to get this working, but I couldn't. Can you help me with this? What is missing?

junaidurfjd commented 10 years ago

You only need to direct the icon to the right url..

junaidurfjd commented 10 years ago

@wesleycoder You need the directive to be in a working angular app..

ghost commented 10 years ago

yeah I looked at the example in the demo site, I should've paid more attention to that. thanks anyway :)

ghost commented 10 years ago

I've updated the Plunkr, (sorry about the fist, something with the save)...

This one has everything to run angular-material but the icon is placed in full width... no css is aplied...

http://plnkr.co/edit/0YyCNF

ThomasBurleson commented 10 years ago

The <material-icon> [in its current functionality] can only be used to display SVG(s); it uses the object element and references an external SVG file. This approach is currently the most popular way to add SVG to a page served up as HTML.

@see Using SVGs

The icon attribute is transposed and assigned to the data attribute in <object data="">. As such, the <material-icon> does not currently support any other formats (PNG, JPEG, etc).

The Angular Material team is aware of these issues. Revisions for this component are planned.

ghost commented 10 years ago

Thank you, very clear