Using AngularJS Scope to Map an Array within a JSON Array

Question

Using AngularJS Scope to Map an Array within a JSON Array

I'm attempting to extract the type and url values from the media2 object within this JSON array and assign them to an AngularJS scope Array.

"results":[
    {
        "session2":[
            {
                "__type":"Object",
                "about":"about here",
                "attendant2":{
                    "__type":"Relation",
                    "className":"_User"
                },
                "className":"sessionClass",
                "createdAt":"2015-09-16T06:12:54.461Z",
                "media2":[
                    {
                        "__type":"Object",
                        "priority":1,
                        "type":3,
                        "updatedAt":"2015-09-16T06:12:54.153Z",
                        "url":"https://example.com"
                    }
                ],
                "updatedAt":"2015-09-16T06:12:54.461Z"
            }
        ],
        "updatedAt":"2015-10-16T06:08:57.726Z"
    }
]

I have tried using the following code snippets:

$scope.mediaType = results['object'].map(function(item) {
                return item.get('session2')[0].get('media2')[0].get('type');
});

and this

$scope.mediaType = results['session2'].map(function(item) {
            return item.get('media2')[0].get('type');
});

However, I keep receiving

TypeError: results.object is undefined

or

TypeError: results.session2 is undefined

. How can I access the value from that JSON?

javascript arrays angularjs json

Answer 1

Answer №1

the variable "results" is an array, not an object; you can retrieve its contents by accessing it using the notation results[0].session2.map

Answer 2

the variable "results" is an array, not an object; you can retrieve its contents by accessing it using the notation results[0].session2.map

Answer 3

Answer №2

give this a shot

var data = {
  "info": [{
    "sessionInfo": [{
      "__type": "Object",
      "description": "details here",
      "speakerInfo": {
        "__type": "Relation",
        "className": "_User"
      },
      "className": "sessionInformation",
      "createdAt": "2015-09-16T06:12:54.461Z",
      "mediaContent": [{
        "__type": "Object",
        "priority": 1,
        "format": 3,
        "updatedAt": "2015-09-16T06:12:54.153Z",
        "urlPath": "https://www.youtube.com/watch?v=cVjT1QGilAg"
      }],
      "updatedAt": "2015-09-16T06:12:54.461Z"
    }],
    "updatedAt": "2015-10-16T06:08:57.726Z"
  }]
}


var transformedData = data.info.map(function(item) {
  return {
    format: item.sessionInfo[0].__type,
    url: item.sessionInfo[0].mediaContent[0].urlPath
  }
})
document.write(JSON.stringify(transformedData))

Answer 4

give this a shot

var data = {
  "info": [{
    "sessionInfo": [{
      "__type": "Object",
      "description": "details here",
      "speakerInfo": {
        "__type": "Relation",
        "className": "_User"
      },
      "className": "sessionInformation",
      "createdAt": "2015-09-16T06:12:54.461Z",
      "mediaContent": [{
        "__type": "Object",
        "priority": 1,
        "format": 3,
        "updatedAt": "2015-09-16T06:12:54.153Z",
        "urlPath": "https://www.youtube.com/watch?v=cVjT1QGilAg"
      }],
      "updatedAt": "2015-09-16T06:12:54.461Z"
    }],
    "updatedAt": "2015-10-16T06:08:57.726Z"
  }]
}


var transformedData = data.info.map(function(item) {
  return {
    format: item.sessionInfo[0].__type,
    url: item.sessionInfo[0].mediaContent[0].urlPath
  }
})
document.write(JSON.stringify(transformedData))

Answer 5

Answer №3

Following the approach suggested in a previous question, I have implemented the following code snippet:

$scope.mediaType = [];
var media2 = results.get('session2')[0].get('media2');

for (i = 0; i < media2.length; i++) {
    $scope.mediaType.push({
        type: session[i].get('type'),
        url: session[i].get('url'),
    });
};

Answer 6

Following the approach suggested in a previous question, I have implemented the following code snippet:

$scope.mediaType = [];
var media2 = results.get('session2')[0].get('media2');

for (i = 0; i < media2.length; i++) {
    $scope.mediaType.push({
        type: session[i].get('type'),
        url: session[i].get('url'),
    });
};

Using AngularJS Scope to Map an Array within a JSON Array

Answer №1

Answer №2

Answer №3

Similar questions

How can I combine two json arrays in MySQL using a query?

Harness the power of our custom directive when integrating with x-editable functionality

I am having difficulty accessing specific data in JSON using Searchkit's RefinementListFilter

Accessing a key from an AJAX JSON response and applying it within a .each() loop in jQuery

Exploring Angular: Utilizing URL Parameters for Multiple States

Utilizing lodash and JavaScript for data normalization techniques

The CSS_MODULES encountered a module build error when utilizing the extract-text-webpack-plugin

Deleting the v-stepper-header number with Vuetify

What is the best way to decode a JSON object containing geo:point data in PHP?

React Table in Modal Using Custom Hook State

The hyperlink element has been added but is not clickable

Exploring the Latest PHP Popup Upgrade

Is it considered acceptable to utilize a v-model's value as the basis for an if-statement?

Traversing JSON data in PHP

Incorporating an Angular 2 application into HawtIO as a plugin

How to target and set focus on dynamically generated input field when the ID is unknown

What is the best method for transforming an object into an interface without prior knowledge of the keys

Eliminating bottom section in HTML/CSS

Upgrading an Express 2.x application to Express 3.0

Using Angular's ngBlur directive on multiple input fields