Reading Json in angularjs
{
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
Hello,
I am getting Json like this style. This is what I am using to display the json object.
<table class="table">
<thead>
<tr>
<th ng-repeat=" x in schedule" scope="col">{x.day}</th>
</tr>
</thead>
<tbody>
<tr>
<th ng-repeat=" x in schedule" scope="row">{x.name}</th>
<td>{x.parts}</td>
</tr>
</tbody>
</table>
But this seems not to work. Its giving me error and does not bind any data at all in the table. I even try to watch "watch window" but I do not know how to display everything in table. Any help will really be appreciated. I am doing this in angularjs. Thank you
angularjs
add a comment |
{
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
Hello,
I am getting Json like this style. This is what I am using to display the json object.
<table class="table">
<thead>
<tr>
<th ng-repeat=" x in schedule" scope="col">{x.day}</th>
</tr>
</thead>
<tbody>
<tr>
<th ng-repeat=" x in schedule" scope="row">{x.name}</th>
<td>{x.parts}</td>
</tr>
</tbody>
</table>
But this seems not to work. Its giving me error and does not bind any data at all in the table. I even try to watch "watch window" but I do not know how to display everything in table. Any help will really be appreciated. I am doing this in angularjs. Thank you
angularjs
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00
add a comment |
{
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
Hello,
I am getting Json like this style. This is what I am using to display the json object.
<table class="table">
<thead>
<tr>
<th ng-repeat=" x in schedule" scope="col">{x.day}</th>
</tr>
</thead>
<tbody>
<tr>
<th ng-repeat=" x in schedule" scope="row">{x.name}</th>
<td>{x.parts}</td>
</tr>
</tbody>
</table>
But this seems not to work. Its giving me error and does not bind any data at all in the table. I even try to watch "watch window" but I do not know how to display everything in table. Any help will really be appreciated. I am doing this in angularjs. Thank you
angularjs
{
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
Hello,
I am getting Json like this style. This is what I am using to display the json object.
<table class="table">
<thead>
<tr>
<th ng-repeat=" x in schedule" scope="col">{x.day}</th>
</tr>
</thead>
<tbody>
<tr>
<th ng-repeat=" x in schedule" scope="row">{x.name}</th>
<td>{x.parts}</td>
</tr>
</tbody>
</table>
But this seems not to work. Its giving me error and does not bind any data at all in the table. I even try to watch "watch window" but I do not know how to display everything in table. Any help will really be appreciated. I am doing this in angularjs. Thank you
angularjs
angularjs
edited Nov 20 '18 at 13:18
Romain Le Qllc
1108
1108
asked Nov 20 '18 at 2:36
sethseth
53
53
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00
add a comment |
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00
add a comment |
2 Answers
2
active
oldest
votes
try below code snippet.
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
add a comment |
The mistake is in the binding. You need to use double curly markup binding like {{x.day}}, {{x.name}} etc.
Please refer this link for more information.
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53385406%2freading-json-in-angularjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
try below code snippet.
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
add a comment |
try below code snippet.
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
add a comment |
try below code snippet.
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
try below code snippet.
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
var myApp = angular.module('myApp',);
function MyCtrl($scope) {
$scope.schedule = {
"days": [
{
"day": "2018-11-25T00:00:00",
"entries": [
{
"name": "D",
"value": 1,
"parts": [
"EG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"Lead"
]
},
{
"name": "W",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "Jen C",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "T",
"value": 2,
"parts":
},
{
"name": "B",
"value": 2,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"Melody"
]
},
{
"name": "R",
"value": 0,
"parts":
},
{
"name": "B",
"value": 1,
"parts": [
"AG"
]
},
{
"name": "S",
"value": 0,
"parts":
},
{
"name": "N",
"value": 2,
"parts":
},
{
"name": "J",
"value": 2,
"parts":
},
{
"name": "S",
"value": 1,
"parts": [
"2nd"
]
}
]
}
]
};
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="MyCtrl">
<table class="table" border=1>
<thead>
<tr>
<th ng-repeat=" x in schedule.days" scope="col">{{x.day}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat=" item in schedule.days[0].entries" scope="row">
<td>{{item.name}}</td>
<td ng-repeat=" itm in item.parts">{{itm}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
answered Nov 20 '18 at 3:04


Shiv Kumar BaghelShiv Kumar Baghel
1,3373620
1,3373620
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
add a comment |
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
Should provide an explanation of what is different and why it solves OP's issue. "try this" is meaningless and therefore people have to sniff out and try to compare differences
– charlietfl
Nov 20 '18 at 4:16
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
@Shiv Kumar Baghel Thank you so much this worked. I guess my problem was I did not how to take a inner array and try to make into ng repeat. This was really helpfull. The only thing I am confuse is " <td ng-repeat=" itm in item.parts">{{itm}}</td>" why are we using the item.parts rather than schdule.parts ? Thank you
– seth
Nov 20 '18 at 12:05
add a comment |
The mistake is in the binding. You need to use double curly markup binding like {{x.day}}, {{x.name}} etc.
Please refer this link for more information.
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
add a comment |
The mistake is in the binding. You need to use double curly markup binding like {{x.day}}, {{x.name}} etc.
Please refer this link for more information.
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
add a comment |
The mistake is in the binding. You need to use double curly markup binding like {{x.day}}, {{x.name}} etc.
Please refer this link for more information.
The mistake is in the binding. You need to use double curly markup binding like {{x.day}}, {{x.name}} etc.
Please refer this link for more information.
answered Nov 20 '18 at 11:16
SukanyaPaiSukanyaPai
407
407
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
add a comment |
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
That was not the mistake well short of. I did forgot to put {{}}(binding properly) What I did not do was to get inner array of json. I did not know how to look for inner array. Thank you
– seth
Nov 20 '18 at 11:48
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Oh, alright. Here is a link which helps to understand how to read/access json objects: aspsnippets.com/Articles/… Hope it helps!
– SukanyaPai
Nov 20 '18 at 11:52
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
Thank you that was very helpfull. I am trying to learn how to read nested array in angularjs. That will help me out thank you
– seth
Nov 20 '18 at 12:03
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53385406%2freading-json-in-angularjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
That does not look like a valid JSON string.
– Bishal
Nov 20 '18 at 2:39
post your actual JSON also not console one.
– Shiv Kumar Baghel
Nov 20 '18 at 2:40
@ShivKumarBaghel Updated the json
– seth
Nov 20 '18 at 2:44
@Bishal JSon Updated to make more sense
– seth
Nov 20 '18 at 3:00