Coming from a background in angular and react, I am now delving into the world of polymer.
I have a polymer class called myClass with the following template.
<div id="[[x]]">
Here, 'x' is a property defined in a property getter.
static get properties() {
return {
x: {
type: Number,
value: 200
}
}
If I dynamically set the value of 'x' using the Chrome dev tools console, like myClass.x = '5', it works perfectly and the output will be:
<div id="5">
The same applies for other HTML attributes such as:
<div width="[[x]]">
<div height="[[x]]">
Now, let's consider a situation where I want to give a margin property dynamically to my div in the same way I did with id, width, and height. How can I achieve this in Polymer?
In angular, we would do something like this:
<div [style.marginTop.px]="marginTop">
I'm curious to hear how you would tackle this in a Polymer context. Share your thoughts!