Get JSON key from object - AngularJS

Question

I have a JSON object that contains a map of values. The keys of these map item are predefined. I use ng-repeat to create a button for each map item and I pass the item to the method via ng-click.

To execute a certain call, I now need the key of the item. How can I get the key of the given item?

The JSON looks like

"map": {
    "0": {
      "id": 1,
      "value": "123",
    },
    "1": {
      "id": 5,
      "value": "567",
    }
}

.html

<div ng-repeat="item in object.map">
    <button ng-click="load(item)" type="button">A</button>
</div>

app.js

$scope.load= function(item) {
    // HOW TO GET THE KEY OF THE GIVEN MAP ITEM
};

Alberto Trindade Tavares · Accepted Answer · 2019-09-27 12:30:43Z

2

You can iterate over the properties of this object, getting the pair (key, item), using the following syntax:

<div ng-repeat="(key, item) in object.map">
    <button ng-click="load(key, item)" type="button">A</button>
</div>

In this way, you pass the key of the item to the load function. In this link, you can find more details about this syntax for ng-repeat.

edited Sep 27, 2019 at 12:30

answered Sep 27, 2019 at 12:10

Alberto Trindade Tavares

10.5k6 gold badges42 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Harshad · Accepted Answer · 2019-09-27 12:11:25Z

1

This may help you.

<div ng-repeat="(key, value) in object.map">
    <button ng-click="load(key,value)" type="button">A</button>
</div>

answered Sep 27, 2019 at 12:11

Harshad

1341 silver badge6 bronze badges

Comments

jigar kataria · Accepted Answer · 2019-10-01 11:52:23Z

0

Another approach you can use is getting object into your controller and acess keys there using Object.keys(objname).

app.js will look sommething like this:

$scope.load= function(item) {
  let key = Object.keys(item);
};

answered Oct 1, 2019 at 11:52

jigar kataria

73 bronze badges

Collectives™ on Stack Overflow

Get JSON key from object - AngularJS

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related