I'm trying to use rivets.js (via rivets-rails
gem) to bind an array of straight JavaScript objects (no JS model library like Backbone etc), which are retrieved via JSON api in a Rails app.
The element to bind to (first HAML, then output):
%tr(rv-each-function="functions")
%td { function.name }
<tr rv-each-function="functions">
<td>{ function.name }</td>
</tr>
Binding code (CoffeeScript):
functions_table = rivets.bind $("#functions_table"), {functions: AdminData.Functions}
AdminData.Functions
looks like this (via JSON.stringify):
[{"id":1,"name":"SomeData"},{"id":2,"name":"OtherData"},{"id":3,"name":"YetMoreData"}]
When I inspect the rivets View functions_table
via console.log
, I see that tbody#functions_table
is the sole member of functions_table.els
and that functions_table.models.functions
contains the expected Array of objects, yet the data isn't being bound, so the output in the page is just { function.name }
, as shown in the first code block.
The rivets documentation is a bit inconsistent - the description shows that one should use data-item-*
yet the example shows rv-item-*
(see Usage Iteration in rivets docs). I've tried both.
Any pointers greatly appreciated. Cheers.