I'm newbie at javascript, angularJS and JQuery, but I have just started programming a angularJS app where i use JQuery to get a JSON from a webserver like this:
var obj = $.getJSON( "="+ $scope.searchString, function() {
$scope.items = obj.responseJSON.entries;
}
Is there a method equal to $.getJSON in angularJS? So that I don't have to import the JQuery library.
Thanks in advance, newbie.
This is my solution so far:
function InstantSearchController($scope, $http){
$scope.search = function() {
$http.jsonp("="+ $scope.searchString + "?json_callback=JSON_CALLBACK").success(
function(data, status) {
console.log(data);
}
);
}
but I'm getting the error msg:
Uncaught SyntaxError: Unexpected token :
why is this? what am I doing wrong? }
I'm newbie at javascript, angularJS and JQuery, but I have just started programming a angularJS app where i use JQuery to get a JSON from a webserver like this:
var obj = $.getJSON( "http://something.com/lol?query="+ $scope.searchString, function() {
$scope.items = obj.responseJSON.entries;
}
Is there a method equal to $.getJSON in angularJS? So that I don't have to import the JQuery library.
Thanks in advance, newbie.
This is my solution so far:
function InstantSearchController($scope, $http){
$scope.search = function() {
$http.jsonp("http://something.com/lol?query="+ $scope.searchString + "?json_callback=JSON_CALLBACK").success(
function(data, status) {
console.log(data);
}
);
}
but I'm getting the error msg:
Uncaught SyntaxError: Unexpected token :
why is this? what am I doing wrong? }
Share Improve this question edited Oct 15, 2013 at 12:12 Erex asked Oct 14, 2013 at 9:07 ErexErex 1,6731 gold badge17 silver badges21 bronze badges6 Answers
Reset to default 8Because of the help i got from people answering my question I finally managed to fix it, and i did it like this:
app.controller('myController', function($scope, $http){
$scope.items = [];
$scope.search = function() {
$http({method: 'JSONP', url: "http://something.com/lol?callback=JSON_CALLBACK&query="+ $scope.searchString}).
success(function(data, status) {
$scope.items = data.entries;
}).
error(function(data, status) {
console.log(data || "Request failed");
});
};
Hope this helps anyone who has the same problem in the future :D
You could use $http
to send AJAX requests in Angular.
You may use JSONP requests with $http.jsonp
https://docs.angularjs.org/api/ng/service/$http#jsonp
function ListProdcutsCtrl($scope, $http) {
var request = {'searchString' : 'apple'};
$http.get('/api/products', request).success(function(response) {
$scope.products_table_data = response.products;
});
There is an alternative in AngularJS called $http
, you can find more here.
For instance :
$http({method: 'JSONP', url: 'http://domain.com/page?json_callback=JSON_CALLBACK'}).success(
function(data, status) {
// your stuff.
}
);
Or even shorter :
$http.jsonp('http://domain.com/page?json_callback=JSON_CALLBACK').success(
function(data, status) {
// your stuff.
}
);
JSONP (JSON Padding) allows you to get JSON data from another domain. However, the data you get should not be plain JSON, but rather a Javascript file like this :
JSON_CALLBACK([
{"name": "apple", "color": "red"},
{"name": "banana", "color": "yellow"}
]);
If your JSON data you need comes from the same domain, you do not need JSONP.
JSONP is used to overcome the cross-domain restriction of the AJAX URL calls.
With AngularJS (v1.5), you can use this code to send cross domain requests:
$http.jsonp(baseurl+'?token=assume_jwt_token'+encoding+type + "&callback=JSON_CALLBACK")
The Syntax for AngularJS JSONP request is :
$http.jsonp(url, [config]);
where url is "string" type representing Relative or absolute URL specifying the destination of the request. The name of the callback should be the string JSON_CALLBACK, and [config] is Optional configuration object.