Access Nested Backbone Collection

Question

Below is what i am populating my collection with (FacetModels)

How do I access the AvailableValues[] array

"FacetModels":[ { "FacetDisplayLabel":null, "SelectedValues":[], "AvailableValues":[], "UnknownResults":0, "ActionURI":null, "FacetGroupName":"Category", "FacetGroupFriendlyId":"SourceCategory", "FacetGroupOrder":10, "AllowSuggestions":false },

This is my view, as you will see all i have access to is the array of FacetModels, I need to be able to pass FacetModels[0].AvailableValues.Name so I can display each category Name

CategoryListItemView = Backbone.View.extend({
    tagName: "li",
    className: "category",
    initialize: function (options) {
        this.template = _.template( $("#categorylist_template").html());
    },
    render: function () {
        var category = this.model
        console.log(category);
        console.log(this.model.toJSON());
        $(this.el).html(this.template(this.model.toJSON()));
        return this;
    }
});

Display from console

a.Model {cid: "c2", attributes: Object, collection: r, _changing: false, _previousAttributes: Object…} _changing: false _events: Object _pending: false _previousAttributes: Object attributes: Object ActionURI: null AllowSuggestions: false AvailableValues: Array[8] 0: Object ActionURI: "/api/search?firstname=thomas&firstname_variants=true&lastname=smith&region=all&sourcecategory=armed%20forces%20utf0026%20conflict" Count: 8943 DisplayLabel: "Armed Forces & Conflict" IsUnknown: false Name: "Armed Forces & Conflict" proto: Object 1: Object 2: Object 3: Object 4: Object 5: Object 6: Object 7: Object length: 8 proto: Array[0] FacetDisplayLabel: null FacetGroupFriendlyId: "SourceCategory" FacetGroupName: "Category" FacetGroupOrder: 10 SelectedValues: Array[0] UnknownResults: 0 proto: Object changed: Object cid: "c2" collection: r proto: Object

What is the model of your view? Is AvailableValues a collection, or just an attribute with an array? What is displayed in your console? And so on... — Loamhoof
I've added the console output. It is in my model as an attribute but part of an array. ie FacetModels[0].AvailableValues[] — Rob Paddock

Dennis Burton Dennis Burton · Accepted Answer · 2013-04-11T14:19:22

Inside your view the javascript array is available through this.model.get('AvailableValues'). If you need Available values to be a Backbone Collection, you can override parse to populate the AvailableValues property with a collection instead of an array.

There are some other SO questions that have examples of this:

Access Nested Backbone Collection

1 Answers