Why is meta-information not rendered in this MarionetteJS composite view?

Question

I am getting this unexpected behavior of loading meta information with a CompositeView with MarionetteJS. The JSON from server-side looks like:

{
    "meta": {
        "total": 2
    },
    "movies": [
        {
            "category": "Action",
            "description": "Another story goes ....",
            "id": 1,
            "stars": "4.0",
            "title": "My test movie"
        },
        {
            "category": "Action",
            "description": "the story goes....",
            "id": 2,
            "stars": null,
            "title": "my second movie"
        }
    ]
}

I use a Backbone collection to set the meta information like:

MA.Collections.Movies = Backbone.Collection.extend({
  url: '/api/movies.json',
  parse: function(data) {
    this.meta = new MA.Models.MetaMovie(data.meta);
    return data.movies;
  }
});

MA.addInitializer(function() {
  MA.Collections.Movies.model = MA.Models.Movie;
})

But when I try to access this meta variable from the CompositeView, the collection is initialized properly, while the meta information seems to be lost. Any ideas how to provide this meta information to the model of a CompositeView?

PS The console output looks like:

composite view output

correct. I was trying the approach that is suggested here: stackoverflow.com/questions/5711245/… — poseid
If you post the code for the router/controller that creates your collection and view instances I will show you a clear way of accomplishing what you are trying to do. — Scott Puleo
Thanks! I am having the app here: github.com/mulderp/moviedb/blob/master/app/assets/javascripts/… -> then there is /views/composites with the meta view — poseid

Scott Puleo Scott Puleo · Accepted Answer · 2013-04-22T16:56:28

Setup a callback from fetch and use it to set the value of meta.total directly onto your metaMovie model instance

movies.js:

MA.addInitializer(function(){
  var self = this;
  var metaMovie = new MA.Models.MetaMovie({total: 1});

  MA.collections.movies = new MA.Collections.Movies();
  MA.composites.movies = new MA.Views.Composites.Movies({
    itemView: MA.Views.Items.Movie,
    model: metaMovie,
    collection: MA.collections.movies
  });
  var p = MA.collections.movies.fetch();

  // see http://api.jquery.com/jQuery.ajax/ for details
  p.done(function(data) {
    self.metaMovie.set({total: data.total});
  });
});

Why is meta-information not rendered in this MarionetteJS composite view?

1 Answers