current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

Ok, heres the pickle:

Im using ng-repeat to iterate through the menu items:

<!-- start the list/loop -->
<ion-list ng-repeat="this in menuItems.items track by $index" type="item-text-wrap">

    <a class="item" ng-click="addToCart({{this}})">{{this.name}}
        <span class="badge badge-stable">{{theCart[$index].product.qty}}</span>
    </a>

</ion-list>
<!-- end the list/loop -->

The problem arises when I try to get the value out of the item in the cart 'theCart[$index].product.qty' since the $index is not bound to any particular item, just the position in the array. I need to get to a unique identifier 2 objects deep in the array so I can be sure to get the correct values with the two-way data binding Angular is so nice to provide.

theCart: [{
    product: {
        id: 1,
        section: 'sides',
        name: 'mayo',
        price: 7,
        outOfStock: '',
        qty: 1
    }
}, {
    product: {
        id: 0,
        section: 'sides',
        name: 'ranch',
        price: 6,
        outOfStock: '',
        qty: 1
    }
}];

Thanks in advance for any insight.

share|improve this question
    
What exactly is the issue? "this.id" won't work? –  pixelbits Sep 5 '14 at 4:13

1 Answer 1

up vote 0 down vote accepted

I'm not sure if I have understood your question properly.

But assuming that menuItems.items is an array of products that for some reason its items don't have the property qty and that theCart is a different array of products in which its items do have the property qty. And that what you want is to get the available quantity of the product that you are iterating from the array theCart, you could do it using the filter 'filter', like this:

<ion-list ng-repeat="item in menuItems.items" type="item-text-wrap">
    <a class="item" ng-click="addToCart(item.id)">{{item.name}}
        <span class="badge badge-stable">
           {{(theCart | filter:{product:{id:item.id} })[0].product.qty}}
        </span>
    </a>
</ion-list>

I must say that this is a very ugly way to do it, I wouldn't recommend doing it like this to anyone. It would be much better to generate a "joined array" of those 2 arrays in the controller and to iterate that "joined array" instead.

share|improve this answer
    
Thanks. I agree this looks pretty ugly. I think I will just refactor the array structure to be one 'menu[]' array with a 'cart:0' and 'cart:1' boolean property. This seems like it would be the Angular way since it will utilize the two-way data binding in its most distilled form. Minimum code to get the result. Agreed? –  user3865639 Sep 5 '14 at 16:03

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.