سؤال

I have the following code inside index.eco

<% for drawing, index in @drawings: %>
    <li class="span4 well">
      <div style="margin-bottom: 10px;">
        <h3 style="margin-top: 0;"><%=drawing.name%></h3>
      </div>
      <div>
        <a href="#/drawings/<%=drawing.id%>">
          <img src="<%=drawing.cache%>" style="background-color: white; border: 1px solid #ddd">
        </a>
      </div>
      <div style="margin-top: 10px; text-align: right;">
        <button class="btn btn-danger delete" data-id="<%=drawing.id%>" style="display:inline;">Delete</button>
      </div>
    </li>
    <% if (index + 2) % 3 is 0: %>

This code is working fine, although I now want to have it executed, each time an event is triggered. I found how I can listen for events using this:

    <% Spine.Model.bind('Model:fileLoad',(map) => console.log("triggered")) %>

Although I cannot find how I can apply the same method, in order to execute the first snippet when the event is fired. I tried adding a function signature on top of snippet and then inline it, as well as some other approaches but none is working. The complete index file can be found here, although I guess that is not relevant. Any comments are welcome.

What this code does is populate the interface based on existing drawings. Although drawings only become available few seconds after the page has finished loading, so I want to execute this code once I make sure that the Models are available.

Update

I have added a function definition, although I am not sure if its correct. 'trig' is printed on event, although the view does not change.

<% @fetchModels= -> : %>
  <% console.log("trig") %>
  <% for drawing, index in @drawings: %>
  . . .
<% end %>
<% Spine.Model.bind('Model:fileLoad',@fetchModels) %>
هل كانت مفيدة؟

المحلول

THe changes had to be done in the Controller rendering the index.eco file. From there I had to bind to an event, and when that event is fired call @render function.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top