Model

Rendr models extend Backbone Models. They are configured to run on the client and server, though some of the functionality works a little different between the two. You won't normally need to worry about these differences in your project.

The model also mixes in the syncer functionality for fetching data from an API on the client or the server.

api Model.api

api is a configuration that allows you to change to a different API. These APIs are configured to the dataAdapterConfig. The configuration key for the host/protocol will automatically be set on the model in the API-Proxy layer. This allows you to talk directly to third party sites without having to worry about cross-site scripting.

// DataAdapterConfig
dataAdapterConfig: {
  'github': {
    host: 'api.github.com',
    protocol: 'https'
  },
  'default': {
    host: 'my.site.com',
    protocol: 'https'
  }
}


// model
module.exports = Base.extend({
  api: 'github',
  url: '/test/:id'
});
// URL for fetch would be https://api.github.com/test/<id of the model>

If you don't provide an api it will automatically use the default key in the dataAdapterConfig.

constructor new Model([attributes], [options])

The constructor will create an instance of a Rendr Model. The constructor invokes the parent Backbone initialization, and finally stores the instance in the model store.

The attributes variable is the data you want the model to store. The options are additional options you wish to pass into the model, they are saved on the model as this.options. options expects a reference to the app object, which is required for the Syncer to work. These are the same arguments you pass to Backbone.Model.

To add functionality to the constructor, add an initialize function. This allows you to hook into the Model creation flow. For more information about how to override initialize check out Backbone's documentation.

jsonKey Model.jsonKey

jsonKey is the JSON root of the response from the API. An API response with a root key will automatically be parsed.

Model.jsonKey = 'user';
// expected data format from the API
// this will then be parsed and set onto the model
{
  user: {
    id: 1,
    name: 'Tester'
  }
}

parse Model.parse(response, [options])

The parse method is called when data is returned from a fetch request.

The response is a JSON object, and the value returned from this function will be set as the attributes on the model. If your API is returning a root object in the key, you can set the jsonKey to return the attributes, without having to override the default functionality.

store Model.store()

Saves the data to the model store. The fetch function will retrieve data from the store first when the views are being constructed, thus reducing the number of requests to the server.

By default, store is triggered on the change event of the model's idAttribute. This means that modifying the ID will automatically store the data again, so you don't need to set up a change event on the entire model.

This function invokes the ModelStore.set function with the model.

url Model.url or Model.url()

Same functionality as the Backbone property with the added ability of passing a string with interpolation. For example: '/model/:someAttribute'.