How to load json file in Angularjs for ng-repeat
I have a simple json file with a list of artist names like
["Vincent van Gogh", "Leonardo da Vinci", "Pablo Picasso"]
I can't figure out how to load this external json file into an array of corners and use ng-repeat on it. The non-working code I've tried is:
<tr ng-repeat="artist in artists">
<td>{({ artist })}</td>
<td></td>
</tr>
<script>
var artApp = angular.module('artApp', []);
artApp.config(function($interpolateProvider){
$interpolateProvider.startSymbol('{({').endSymbol('})}');
});
artApp.controller('mycontroller', function($scope,$http){
$scope.artists = [];
$http.get('/home/user/artist_names.json').success(function(data) {
angular.forEach(data.MainRegister,function(entry) {
$http.get(entry.url).
success(function(data) {
$scope.artists.push(angular.extend(entry,data.SubInformation);
});
});
});
});
</script>
Not only does this controller code fail, but it breaks my code $interpolateProvider
and makes the html render my original angular variables.
source to share
Example link below for ng-repeat
artApp.controller('TodoCtrl', function($scope, $http) {
$http.get('/home/user/artist_names.json')
.then(function(result){
$scope.artists = result.data;
});
});
In html
<ul>
<li ng-repeat="artist in artists">
{{artist.name}}
</li>
</ul>
IN YOUR JSON
[{ "name":"Vincent van Gogh"},
{ "name":"Leonardo da Vinci"},
{ "name":"Pablo Picasso"}]
http://plnkr.co/edit/Wuc6M7?p=preview
From jaime
I ran into this issue with a node server hosted in Azure and the fix was to set the MIME type for the JSON files. I was hosting in blue, which meant making sure the web.config exists with the correct settings, but I'm not sure what is needed with Django. Without an appropriate mime type, the server will report 404 as you mentioned.
From Sam Storey
source to share
I ran into this issue with a node server hosted in Azure and the fix was to make sure the MIME type for the JSON files is set correctly. I've been involved with azure so that meant making sure the web.config exists with the correct settings, but I'm not sure what is needed with Django. Without an appropriate mime type, the server will report 404 as you mentioned.
source to share