I was developing a page using knockout. I have bind an array to the html as follows
data:
{'options':[{'name':'hi'},{'name':'hello'}])
html:
<div data-bind="foreach: options">
<div data-bind="text: name, css: name"></diV>
</div>
Each option have an image and i am using css sprites. and the class name are like
div.option-
<name>
css:
div.option-hi{
background-color:black;
}
div.option-hello{
background-color:black;
}
So this will only work if I can append
"div.option-"
to the name attribute inside data-bind. Is there anyway I can achieve this without modifying the array and adding one more attribute in to the populate array
If you don't plan to change your array values or wrap them into viewmodels which will do the additional logic, then you can write expressions also directly in the bindings.
So you can do the string concatenation inside the css binding:
<div data-bind="foreach: options">
<div data-bind="text: name, css: 'option-' + name"></div>
</div>
Demo JSFiddle.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments