I'm learning AngularJS and I've some problems importing datas from a .json file in internet to an array. This is the situation: I have to create an html app that imports some datas by an api (.json) on a website, store them in an array, and then show them in a chart. The problem is that I need to pass two values in my datas request, so that I can receive only the datas linked to them. Can someone help me?
1
-
Can you post some code? I don't know exactly what your problem is, you can pass an object in your request with any value that you would needKangcor– Kangcor2015-02-05 08:51:50 +00:00Commented Feb 5, 2015 at 8:51
Add a comment
|
1 Answer
For reading json file below solution should help:- How to display data from a json file in angularjs?
Which is as simple as:-
$timeout(function(){
dbService.getUrl('/js/udata.json').then(function(resp){
$scope.todo=resp;
});},1);
For your question "The problem is that I need to pass two values in my datas request, so that I can receive only the datas linked to them", probably if you can furnish some more details/specifics of requirement then we can help.
Update:
Here is the code which works for me:-
My javascript:-
var todoApp= angular.module('todoApp',[]);
todoApp.factory('dbService', ['$q','$http',function ($q , $http) {
var service ={};
service.localCache = {hasdata:false,data:{},lastLoaded:new Date()};
service.getUrl = function (urlToGet,burstCache) {
var svc=this;
var deferred = $q.defer();
if ((!burstCache)&&(svc.localCache)&&(svc.localCache.hasdata)) {
console.log('resolve from local cache');
return(svc.localCache.data);
}else{
var responsePromise = $http.get(urlToGet);
responsePromise.success(function (data, status, headers, config) {
svc.localCache={};
svc.localCache.hasdata=true;
svc.localCache.data=data;
svc.localCache.lastLoaded= new Date();
deferred.resolve(data);
console.log('resolve from ajax') });
responsePromise.error(function (data, status, headers, config) {
deferred.reject({ error: "Ajax Failed", errorInfo: data }); svc.localCache={}; });
}
return (deferred.promise);
}
return service;
}]);
todoApp.controller("ToDoCtrl", ['$scope','$timeout','dbService',function($scope, $timeout, dbService)
{
$scope.todo={};
$timeout(function(){
dbService.getUrl('http://api.openweathermap.org/data/2.5/forecast/daily?lat=35&lon=139&cnt=10&mode=json',true).then(function(resp){
$scope.todo=resp;
});},1);
}]);
Here's my HTML:-
<body >
<div ng-controller="ToDoCtrl">
<div>
<p>City : {{todo.city.name}}</p>
<p>Country : {{todo.city.country}}</p>
<p>Population : {{todo.city.population}}</p>
<p>COD : {{todo.cod}}</p>
</div>
<table border="1">
<thead>
<tr>
<th>Dt</th>
<th>Pressure</th>
<th>Humidity</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="t in todo.list">
<td>{{ t.dt }}</td>
<td>{{ t.pressure }}</td>
<td>{{ t.humidity }}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Hope This Helps!
4 Comments
Simo
I need to search for a specific city, so I have to pass to the function a longitude and a latitude values. The link is like this: api.openweathermap.org/data/2.5/forecast/… The two values in the link are the two I need to pass.
amitthk
The example in my link above should work for you, just the difference is your request is $http.jsonp(...) because it is a cross site request. Let me come up with a sample code for you. Thanks
amitthk
Hello, I just updated the code where I am able to display the data from your mentioned url. The data returned is simple JSON so no need to do JsonP. I hope this helps. Kindly mark as answer if it is helpful. Thanks!
amitthk
Great! Thanks to you too!