Search code examples
javascriptbackbone.jschaplinjs

how chaplin renders model after fetch?, how the view know that the fetch as finished?


I'm doing a sample proyect based on Chaplin-boilerplate, and is working perfect, but I can't understand how the view render after the fetch has finalized, for example with Backbone you can use on event change, or with a callback in the fetch method, but with chaplinjs how are doing this?, are there using the event change from Backbone?, what class of Chaplinjs is binding the event ? how are doing the binding ?

class CampaignController extends Chaplin.Controller

  title: 'Campaign'
    index: (params) ->
    campaign = new Campaign()
    @view = new CartView model: campaign


class CartView extends View
  template: template
  template = null
  container: '#cart'
  autoRender: true
  className: 'cart'
  initialize: ->
    super
  render: ->
    super

class Campaign extends Model

  initialize: (attributes, options) ->
    super
    @urlRoot = "http://localhost/store/js/test-data/cart.json"
    @fetch()

Solution

  • Where you're doing @view = new CartView model: campaign you're assigning the campaign object as the model to the view. The ChaplinJS View class automatically does the following:

    if (target === 'model' || target === 'collection') {
      prop = this[target];
      if (prop) {
        this.listenTo(prop, eventName, callback);
      }
    }
    

    This should answer your question