Convert a JsonString into an angular.js array

Question

I have a JsonString of the form

[{
    "mileage": 12033,
    "name": "Ford",
    "model": "Focus",
    "engine": "3 gophers on a treadmill",
    "color": "green"
}, {
    "mileage": 85000,
    "name": "Chevy",
    "model": "mailbu",
    "engine": "6 cylinder",
    "color": "Maroon"
}, {
    "mileage": 612033,
    "name": "Ford",
    "model": "F150",
    "engine": "6 cylinder",
    "color": "Green"
}, {
    "mileage": 89500,
    "name": "Pontiac",
    "model": "G6",
    "engine": "2 cylinder",
    "color": "Blue"
}, {
    "mileage": 17200,
    "name": "Pontiac",
    "model": "G8",
    "engine": "3 cylinder",
    "color": "Silver"
}, {
    "mileage": 308,
    "name": "Toyota",
    "model": "Forerunner",
    "engine": "6 cylinders",
    "color": "Grey"
}, {
    "mileage": 65328,
    "name": "Volvo",
    "model": "wagon",
    "engine": "8 cyclinders while not in test mode otherwise 2 bicycle pedals",
    "color": "Red"
}, {
    "mileage": 50,
    "name": "IKea",
    "model": "Ronde",
    "engine": "3 self propelled coasters",
    "color": "wood panelling"
}, {
    "mileage": 17200,
    "name": "Pontiac",
    "model": "Grand Am",
    "engine": "8 cylinder",
    "color": "rusty"
}]

Can someone please help me convert this string into an array in angular.js. I tried to do it for hours and have to finally giveup. Thanks in advance

Possible duplicate of How to decode JSON in Javascript?

n00dl3
– n00dl3

2017-02-24 11:38:26 +00:00
Commented Feb 24, 2017 at 11:38 — n00dl3
– n00dl3, Commented Feb 24, 2017 at 11:38
you could use JSON.parse to get an array of the string.

Nina Scholz
– Nina Scholz

2017-02-24 11:38:27 +00:00
Commented Feb 24, 2017 at 11:38 — Nina Scholz
– Nina Scholz, Commented Feb 24, 2017 at 11:38
Its already an array

Satpal
– Satpal

2017-02-24 11:38:57 +00:00
Commented Feb 24, 2017 at 11:38 — Satpal
– Satpal, Commented Feb 24, 2017 at 11:38
This is array of objects already! what you want?

Muhammad Saqlain
– Muhammad Saqlain

2017-02-24 11:39:54 +00:00
Commented Feb 24, 2017 at 11:39 — Muhammad Saqlain
– Muhammad Saqlain, Commented Feb 24, 2017 at 11:39
I think it is alreay array of objects

Arun Redhu
– Arun Redhu

2017-02-24 11:40:19 +00:00
Commented Feb 24, 2017 at 11:40 — Arun Redhu
– Arun Redhu, Commented Feb 24, 2017 at 11:40

Sudhanshu Jain · Accepted Answer · 2017-02-24 12:08:21Z

You have to assign it inside the app controller and then you can access it like an array in your view.

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl"> 

<p>Today's welcome message is:</p>

<p ng-repeat="x in car">{{x.name}}</p>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $scope.car = [{
    "mileage": 12033,
    "name": "Ford",
    "model": "Focus",
    "engine": "3 gophers on a treadmill",
    "color": "green"
}, {
    "mileage": 85000,
    "name": "Chevy",
    "model": "mailbu",
    "engine": "6 cylinder",
    "color": "Maroon"
}, {
    "mileage": 612033,
    "name": "Ford",
    "model": "F150",
    "engine": "6 cylinder",
    "color": "Green"
}, {
    "mileage": 89500,
    "name": "Pontiac",
    "model": "G6",
    "engine": "2 cylinder",
    "color": "Blue"
}, {
    "mileage": 17200,
    "name": "Pontiac",
    "model": "G8",
    "engine": "3 cylinder",
    "color": "Silver"
}, {
    "mileage": 308,
    "name": "Toyota",
    "model": "Forerunner",
    "engine": "6 cylinders",
    "color": "Grey"
}, {
    "mileage": 65328,
    "name": "Volvo",
    "model": "wagon",
    "engine": "8 cyclinders while not in test mode otherwise 2 bicycle pedals",
    "color": "Red"
}, {
    "mileage": 50,
    "name": "IKea",
    "model": "Ronde",
    "engine": "3 self propelled coasters",
    "color": "wood panelling"
}, {
    "mileage": 17200,
    "name": "Pontiac",
    "model": "Grand Am",
    "engine": "8 cylinder",
    "color": "rusty"
}];

});
</script>

</body>
</html>

Collectives™ on Stack Overflow

Convert a JsonString into an angular.js array

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related