CODEWITHSUNDEEP
arraysangularjsionic-frameworkangularjs-ng-repeat
Pasindu Weerakoon
Pasindu Weerakoon

Reputation: 628

How to access dynamic array and get key-value pairs using ng-repeat

I'm trying to retrieve data from json object for ionic mobile application. But the problem is inside that object has an array this array includes a set of objects. I need to get the key and value pairs from those set of objects, I tried following code to achieve that.

<ion-item ng-repeat="form in forms">
    <ion-item>
        {{form.Form_Group_Name}}
    </ion-item>
    <ion-item>
        <label class="item item-input item-stacked-label colone-input" ng-repeat="(key, value) in form.items">
            <span class="input-label">{{key}}</span>
            <input type="text" value="{{ value }}" placeholder="First name">
        </label>
    </ion-item>
</ion-item>

This is working, but as a key it shows the index of the array (see the following images). Array size can be dynamically changed so then can't use index no to access this. I need to go inside the array and access the object to get key and value.

here is the sample of my json object

enter image description here

result is like this :

enter image description here

Thanks in advance.

Upvotes: 1

Views: 1235

Answers (1)

Pasindu Weerakoon
Pasindu Weerakoon

Reputation: 628

This is how I did it:

<ion-item ng-repeat="form in forms['Form Groups']">
    <ion-item >
        {{form['Form Group Name']}}
    </ion-item>
    <ion-item>
        <label class="item item-input item-stacked-label colone-input" ng-repeat="item in form.items">
            <div ng-repeat="(key, value) in item">
                <span class="input-label">{{key}}</span>
                <input type="text" value="{{ value }}" placeholder="value">
            </div>
        </label>
    </ion-item>
</ion-item>

As you can see here, I added <div> and inside that <div> iterate the item array. The item array includes all the data form json object and then I request key and value from array when the time of the iteration.

Upvotes: 1

Related Questions