Polymer 1.0 - Binding css classes -
i'm trying include classes based on parameters of json, if have property color, $= makes trick pass class attribute (based on polymer documentation)
<div class$="{{color}}"></div>
the problem when i'm trying add class along existing set of classes, instance:
<div class$="avatar {{color}}"></div>
in case $= doesn't trick. way accomplish or each time add class conditionally have include rest of styles through css selectors instead classes? know in example maybe color simple go in style attribute, purely example illustrate problem.
please, note issue in polymer 1.0.
as of polymer 1.0, string interpolation not yet supported (it mentioned in roadmap). however, can computed bindings. example
<dom-module> <template> <div class$="{{classcolor(color)}}"></div> </template> </dom-module> <script> polymer({ ... classcolor: function(color) { return 'avatar '+color; } }); <script>
edit:
as of polymer 1.2, can use compound binding.
<div class$="avatar {{color}}"></div>
now works.
Comments
Post a Comment