Failed to implement computed property in emberjs

Question

My fixture data contains multiple array.Out of this multiple array cart_items contains some product data.

I am trying to calculate total no of products available in cart data (based on length of cart_items items) but i am not able to calculate no of items are present in cart_items.

In router i have selected application fixture as model for current route,as follow :

 Astcart.IndexRoute = Ember.Route.extend({
    model: function() {
      return Astcart.Application.find();
    }
  }); 

Computed property code :

Astcart.IndexController = Ember.ArrayController.extend({
     tot_cart_prd: function() {
          return this.get("model.cart_items").get('length');
      }.property("@each.isLoaded")
});

And my fixture data is :

Astcart.Application.adapter = Ember.FixtureAdapter.create();

Astcart.Application.FIXTURES = [
    {

        "logo_url": "img/logo.jpg",
        "logged_in": {
            "logged": true,
            "username": "sachin",
            "account_id": "4214"
        },
        "category_list": [
            {
                "id": "1",
                "name": "Mobiles & Accessories"
            },
            {
                "id": "2",
                "name": "Computers & Software"
            },
            {
                "id": "3",
                "name": "Fashion"
            },
            {
                "id": "4",
                "name": "Electronics"
            },
            {
                "id": "5",
                "name": "Watches & Jewelry"
            },
            {
                "id": "6",
                "name": "Health & Beauty"
            },
            {
                "id": "7",
                "name": "Games"
            },
            {
                "id": "8",
                "name": "Books & Entertainment"
            },
            {
                "id": "9",
                "name": "Gaming"
            },
            {
                "id": "10",
                "name": "Shoes & Bags"
            }
        ],
        "cart_items": [
            {
                "id": "1",
                "name": "Samsung Galaxy Tab 2",
                "qty": "1",
                "price": "1245.12",
                "subtotal": "7842.23"
            },
            {
                "id": "2",
                "name": "Samsung Galaxy Tab 2",
                "qty": "1",
                "price": "1245.12",
                "subtotal": "7842.23"
            },
            {
                "id": "3",
                "name": "Samsung Galaxy Tab 2",
                "qty": "1",
                "price": "1245.12",
                "subtotal": "7842.23"
            }
        ]           
    }
];

I have posted my code here(JSFiddle).

Can any one tell me why this.get("model.cart_items") is returning null?

Answer 1

Because your IndexController receive an array of Astcart.Application, from the route. You need to iterate in each application and get the length of each category list .

Your computed property need to be the following:

Astcart.IndexController = Ember.ArrayController.extend({
    tot_cart_prd: function() {
        var result = this.get('model').map(function(application) {
            return application.get('category_list.length');
        });
        return result;
    }.property('[email protected]_list.length')
});

Here's an updated fiddle http://jsfiddle.net/marciojunior/PZZym/

Answer 2

I just looked at this and your core issue has something to do with the relationship setup between Application and Cart_items. The reason that this.get("model.cart_items").get('length') is failing is that this.get("model.cart_items") returns null. If you can get your relationship working you should be on the right track. I don't know anything about EmberModel, so I can't be of much help there.