I have a function that takes an input from the front-end, and then concatinates that input into an URL that I want to get from wikipedia. Since I had problems with CORS, I implemented my $http.get as JSONP, and now I get the following error:
angular.js:13236 Error: [$http:badreq] Http request configuration url must be a string. Received: {"method":"JSONP","url":"https://en.wikipedia.org/w/api.php?action=query&format=json&uselang=user&prop=extracts%7Cpageimages&titles=Maya+Angelou&piprop=name%7Coriginal"}
The thing is, that his error shows the concatinated url as a string?
Can anybody point out what I'm doing wrong?
This is the function I am calling:
//function to get author info from wikipedia
$scope.getAuthorInfo = function(author) {
//remove whitespace from author
author = author.replace(/\s/g, '+');
//concat the get URL
var url = 'https://en.wikipedia.org/w/api.php?action=query&format=json&uselang=user&prop=extracts%7Cpageimages&titles=' +
author + '&piprop=name%7Coriginal';
//get author info from wikipedia
$http.get({
method: 'JSONP',
url: url
})
.then(function successCallback(response) {
$scope.author = response.data;
//for every result from wikipedia, trust the extract as html
for (var x in $scope.author.query.pages) {
$scope.author.query.pages[x].extract = $sce.trustAsHtml($scope.author.query.pages[x].extract);
}
}, function errorCallback(response) {
console.log(response);
});
};
If you need additional information, please let me know.
The $http service is a core AngularJS service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP. For unit testing applications that use $http service, see $httpBackend mock.
Answer: C is the correct option. The ng-bind directive is used to bind the application data to the HTML view in the AngularJS application.
HttpRequest represents an outgoing request, including URL, method, headers, body, and other request configuration options. Instances should be assumed to be immutable. To modify a HttpRequest , the clone method should be used.
Use the HttpClient.get() method to fetch data from a server. The asynchronous method sends an HTTP request, and returns an Observable that emits the requested data when the response is received. The return type varies based on the observe and responseType values that you pass to the call.
$http({
method: 'JSONP',
url: url
}).then(function successCallback(response) {
// ok
}, function errorCallback(response) {
// ko
});
$http.get
is a shortcut method for $http({ method: 'GET' })
, and expects the URL as the first parameter.
As you're using JSONP, you could also use the $http.jsonp
shortcut:
$http.jsonp(url).then(function successCallback(response) {
// ok
}, function errorCallback(response) {
// ko
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With