How to display a value from JSON in AngularJS

Question

How can I display a value from JSON data in AngularJS. I am doing a API call to get the JSON data.

An example of some values I want to display:

"Example": [{
    "Source": "Something Here",
    "Value": "1"
}, {
    "Source": "Something Else",
    "Value": "2"
}, {
    "Source": "Another One",
    "Value": "3"
}],

The example shows how the JSON data is delivered. How do I display the value of “something here” and/or display the value of “something else”

I have no problems displaying

"Test1": "Value 1",
"Test2": "Value 2",
"Test3": "Value 3",

Using a function:

function fetch() {
  $http.get("https://www.example.com/exampleData.json")
    .then(function(response) {
      $scope.display = response.data;
    }); 
}

And displaying it with:

<div ng-if="display.Response==='True'">
{{ display.Test1 }}
</div>

Hope I explained myself good enough as I am pretty new to Angular but love it so far!

Since, Example is collection, you will need to iterate it with ng-repeat — sam
– sam, Commented Nov 29, 2019 at 13:48
You were right! This article helped me figuring it out: stackoverflow.com/questions/37229567/… — Mark
– Mark, Commented Nov 30, 2019 at 1:20

Mark · Accepted Answer · 2019-11-30 09:47:26Z

1

Figured it out:

"Example": [{
"Source": "Something Here",
"Value": "1"
}, {
"Source": "Something Else",
"Value": "2"
}, {
"Source": "Another One",
"Value": "3"
}],

The Example is some nested JSON data.

To display a value you can do as so from Example:

<div>Show it to me: {{display.Example[1].Source}}</div>

Which will output:

Show it to me: Something Else

As I said before I am new to angularjs but it's pretty amazing the things you can do.

edited Nov 30, 2019 at 9:47

answered Nov 30, 2019 at 1:29

Mark

7832 gold badges12 silver badges36 bronze badges

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

Comments

basskibo · Accepted Answer · 2019-11-29 13:11:21Z

0

I did not quit understood you what exactly is question, but i could try to guess. Maybe you want to display all values from array:

"Example": [{
    "Source": "Something Here",
    "Value": "1"
}, {
    "Source": "Something Else",
    "Value": "2"
}, {
    "Source": "Another One",
    "Value": "3"
}],

You can do this with ng-repeat, i made you little example : https://jsfiddle.net/cowhazj0/3/

I hope it helps.

answered Nov 29, 2019 at 13:11

basskibo

12 bronze badges

1 Comment

Mark Over a year ago

Sorry if I wasn’t clear enough in my question. I’m new to it :) The example shows how my JSON data is delivered. For instance how do I display the value of “something here” and/or display the value of “something else”

milad shafiei · Accepted Answer · 2019-11-30 11:52:58Z

0

<div ng-repeat="item in display.Example"> {{item.Source}} : {{item.Value}} </div>

answered Nov 30, 2019 at 11:52

milad shafiei

2862 gold badges5 silver badges18 bronze badges

Collectives™ on Stack Overflow

How to display a value from JSON in AngularJS

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related