I am trying to use the WordsAPI and everytime I try to access it using jsnop and Angular I get this error:
The code I am using is the following:
$scope.searchWord = function() {
var url = 'https://www.wordsapi.com/words/'+$scope.word+'/definitions?callback=JSON_CALLBACK&accessToken=ACCESS_TOKEN';
$http.jsonp(url).
success(function(data, status, headers, config) {
$scope.meanings = data;
console.log($scope.meanings)
}).error(function(data, status, headers, config) {
console.log(data);
});
}
So it should be getting something like:
https://www.wordsapi.com/words/word/definitions?callback=JSON_CALLBACK&accessToken=ACCESS_TOKEN
I tested this link on JSON validators and everything is fine with the JSON it gets from the server.
I am using Chrome on a Mac.
Does Anyone have any idea ?
Related
I have a http service which will call external json files and load it into a grid.
My problem is i need to create a custom http service so that i could use the same in different controllers. The function of that custom service should be the same (requesting external Json file)
$http.get('../JSON/permanentEmployees.json').
success(function(data, status, headers, config) {
$scope.masterArray = data;
}).
error(function(data, status, headers, config) {
$scope.errorMessage = "Requested grid data file does not exist";
});
This is my current http service. Any help would be appreciated.Please use angularjs only
wrap the code in a factory and use it. I think its better to use a factory in this situation, refer here. P.S. unable to create a mockup of the request to JSON, please check with your JSON.
JSFiddle: here
app.factory('customHTTPService', function($http){
return {
getRequest: function(url) {
return $http.get(url).
success(function(data, status, headers, config) {
return {data: data, errorMessage: "Success"};
}).
error(function(data, status, headers, config) {
return {data: "", errorMessage: "Requested grid data file does not exist"};
});
}
}
});
In the controller you can do
app.controller('MyController', function MyController($scope, customHTTPService) {
$scope.data = customHTTPService.getRequest('../JSON/permanentEmployees.json').data;
});
Error thrown:
ReferenceError: inject is not defined.
I'm trying to hit the server using angular $http method. I was able to do the same by using npm require library. When I'm trying to do the same with $http I'm facing an issue.
I got angular.mocks.js also installed through npm. can anyone please rectify it. thank you.
describe("POST /", function() {
var $http;
beforeEach (inject(function ($injector) {
$http = $injector.post("$http");
});
it('should demonstrate using when (201 status)', function () {
$http.post('http://localhost:9080/', data, config)
.success(function(data, status, headers, config) {
$scope.valid = true;
$scope.response = data;
})
.error(function(data, status, headers, config) {
$scope.valid = false;
});
expect($scope.valid).toBe(true);
});
});
studentService.js
app.factory('saveStudentService',['$http','$scope',function ($http,$scope) {
var studentData = {};
studentData.save = function(jsondata){
var action = "student";
var method = "POST";
$http({
url: action,
method: method,
headers: {'Content-Type': 'application/json'},
data: jsondata
}).success(function(data, status, headers, config) {
toastr.success(status +' : Data has been submitted successfully ');
}).error(function(data, status, headers, config) {
toastr.error(status + ' : Data has not been submitted successfully ');
});
};
return studentData;
}]);
I am getting this error
angular.js:13642Error: [$injector:unpr] http://errors.angularjs.org/1.5.6/$injector/unpr?p0=%24scopeProvider%20%3C-%20%24scope%20%3C-%20saveStudentService
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:6:412
If from studentService.js, $scope is being removed, i.e
app.factory('saveStudentService',['$http',function ($http) {
this code is working properly, and not getting any error message in console.
Following is the studentController.js file from where this studentService is being called.
StudentController.js
app.controller('saveStudentCtrl',['$scope', 'saveStudentService', function($scope,saveStudentService) {
$scope.submit_create_student = function() {
var jsondata = $scope.student;
saveStudentService.save(jsondata);
}
}]);
but if same thing i.e $scope is being added in the updateStudentService then this code is working as expected.
app.controller('updateStudentCtrl',['$scope','retriveStudentService', 'updateStudentService', function($scope,retriveStudentService, updateStudentService) {
$scope.getStudentDataFromServer = function() {
retriveStudentService.get();
};
$scope.submit_update_student = function(e) {
updateStudentService.update();
}
}]);
Could someone please clarify, what is happening here. Though able to use same thing in one place, but not able to use same process at someother place.
You cannot inject scope into services. You can inject it to controllers.
I'm having a bit of trouble using $http using the AngularJS framework. I've read several of the other posts about this error but I can't work out what I'm doing wrong. Any help would be greatly appreciated. The error is 'Uncaught ReferenceError: $http is not defined' and the code is:
function removePupil(val) {
var string = 'Jon:jon#aaa.com:George:george#aaa.co.uk:Matthew:matthew#aaa.com:';
var pupilNowRemoved = string.replace(val, '');
var data = {
"customer[id]": {{ customer.id }},
"metafield[customer.pupils]": pupilNowRemoved,
};
$http.post('/a/custmeta', $.param(data),
{"headers" : {"Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"}
}).success(function(data, status, headers, config) {
console.log('Removed pupil')
}). error(function(data, status, headers, config) {
console.log('Did not remove pupil')
});
}
Try to include $http in your controller like this:
.controller('MyController', ['$http', function ($http) {}];
simple question, how would I write this in javascript/AngularJS.. this pythonscript works:
xml = <data><user>blabla</user> ..... etc
url = 'http://localhost:3080'
response = urllib2.urlopen(url, xml)
print response
Long story:
I'm playing around with an old, legacy XML service and thought it could be fun to get something working with AngularJS. I might confess that I'm not that familiar with either Angular or Javascript, please bear with me.
The XMLservice expects files with data and instructions on what functions to run etc. It will then respond with another xml file with the answer. However, I can't get the simplest function (login) to work at all.
If I try a "GET" and play with params, the service is triggered but logs "invalid" since it's either missing the XML data or the Xmldata is messed up (when added as param)
angular.module('myApp.loginServices', []).
factory('LoginSource', ['$http',function($http){
return {
get: function(url, callback, transform){
$http.get(
url,
{transformResponse:transform}).
success(function(data, status) {
console.log("success!!!!!!" + status+ " data");
callback(data);
}).error(function(data, status) {
console.log("FAILED!!!! " + status);
});
So I try a POST, like this, and this one gives me "status 0" and XmlService logs "501", maybe my xml is messed up or something, but it looks like it's not even reaching the service according to the logs?
factory('LoginSource', ['$http',function($http){
return {
get: function(url, callback, transform, xmlData){
console.log('xmlData: ' +xmlData);
$http({
url: url,
method: "POST",
data: xmlData,
headers: {'Content-Type': 'application/x-www-rform-urlencoded'}
}).success(function (data, status, headers, config) {
callback(data);
}).error(function (data, status, headers, config) {
console.log('status: ' +status);
});
}
};
I guess it's me being too much of a rookie with javascript and angularJs.. any help appreciated