CODEWITHSUNDEEP
javascriptangularjs
Programador Adagal
Programador Adagal

Reputation: 780

Angular JS NG-Repeat in Subarray

I need to do a ng-repeat on a subarray (inside an element of an array). This is the data;

{familyName:'Vodka', familyCode:'1', hasPremium: '1', families: [
    { subFamilyName: 'Best', products: [
        { title: 'Grey goose 70 cl', price: '400', cant: '0', premium: '1' },
        { title: 'Grey goose 1,5l', price: '875', cant: '0', premium: '0' }
    ]},
    { subFamilyName: 'Poor', products: [
        { title: 'Grey goose 10 cl', price: '40', cant: '0', premium: '0' },
        { title: 'Grey goose 17,5l', price: '85', cant: '0', premium: '0' }
    ]}
]},
{familyName:'Rum', familyCode:'1', hasPremium: '1', families: [
    { subFamilyName: 'Best', products: [
        { title: 'Grey goose 70 cl', price: '400', cant: '0', premium: '1' },
        { title: 'Grey goose 1,5l', price: '875', cant: '0', premium: '0' }
    ]},
    { subFamilyName: 'Poor', products: [
        { title: 'Grey goose 10 cl', price: '40', cant: '0', premium: '0' },
        { title: 'Grey goose 17,5l', price: '85', cant: '0', premium: '0' }
    ]}
]

Perfect. I have in my $scope one var called selectedFamily which saves the family Code selected with navigation purposes. Now, in a I need to print the subfamilies of the selected family (coded in selectedFamily var) and the products of each of that subfamilies.

I was thinking how too filter and do the ng-repeat.

Upvotes: 0

Views: 619

Answers (1)

Aleksandar Gajic
Aleksandar Gajic

Reputation: 1359

Here is the solution for you

<li ng-repeat="item in items">
                <input type="text" ng-model="item.familyName" />
                <input type="text" ng-model="item.familyCode" />
                <ul>
                    <li ng-repeat="subItem in item.families">{{subItem.subFamilyName}}
                        <div ng-repeat="subSubItem in subItem.products">
                            <input type="text" ng-model="subSubItem.title" />
                            <input type="text" ng-model="subSubItem.price" />
                        </div>
                    </li>
                </ul>
            </li>

You can look at this fiddle http://jsfiddle.net/1ncubt8v/

Upvotes: 3

Related Questions