in reply to Perl Restfull call by Angular JS not working

So you're asking us to debug your js? This is considered off topic

Also, see http://stackoverflow.com/questions/26859987/angularjs-restful-webservice-call

  • Comment on Re: Perl Restfull call by Angular JS not working

Replies are listed 'Best First'.
Re^2: Perl Restfull call by Angular JS not working
by akuk (Beadle) on Jun 06, 2015 at 04:23 UTC

    It might be or may be not considered off topic, may be return function in the perl that I write above is not returning the format understandable by AJS, so I am not sure. I am still figuring it out whats wrong with the code :(

      Then maybe look at what the Perl code returns and see whether it is what you expect?

      The AngularJS documentation should be clear about what it expects.

      With HTTP, you can conveniently test the server side and the client side separately, and even inspect all communication between the two parts. Replace the AngularJS by manual interaction and you can test out the Perl code. Once you are satisfied that your Perl code works as it should, you can then use static files served from your webserver as responses to test your AngularJS code. It's not hard.

      may be return function in the perl that I write above is not returning the format understandable by AJS, so I am not sure.

      What format is it supposed to return?

      Like corion said, try it out to see what it actually returns, then adjust until it matches your expectations

        Hi Now My AJS code is working fine now. Now the problem is with the perl. Below is code for AJS

        <!DOCTYPE html> <html ng-app="MyApp"> <head> <script data-require="angular.js@*" data-semver="1.4.0-rc.2" src=" +https://code.angularjs.org/1.4.0-rc.2/angular.js"></script> <link rel="stylesheet" href="style.css" /> <script src="script.js"></script> </head> <body ng-controller="MyController"> <h1>Welcome!</h1> <ul> <li ng-repeat="x in names">{{x.Name + ' | ' + x.Country}}</li> </ul> <script> var MyResponse = { "records":{ "2":{"City":"México D.F.","Country":"Mexico","Name":"An +a Trujillo Emparedados y helados"}, "1":{"Name":"Alfreds Futterkiste","Country":"Germany","C +ity":"Berlin"} } } var app = angular.module('MyApp', []); app.controller('MyController', ['$scope', '$http', function($sco +pe, $http) { $scope.names = {}; $http.get("http://localhost:5000/about") .success(function (response) {$scope.names = response.records; +}) .error(function(err){ $scope.names = MyResponse.records; }); }]); </script> </body> </html>

        Now, when I run the url in the browser, I get the {"records": { "2":{"City":"México D.F.","Country":"Mexico","Name":"Ana Trujillo Emparedados y helados"}, "1":{"Name":"Alfreds Futterkiste","Country":"Germany","City":"Berlin"} } } This is same I required for AJS to work but in the dancer logs it gives an error "Failed to serialize the request: hash- or arrayref expected (not a simple scalar, use allow_nonref to allow this) at /usr/local/share/perl/5.18.2/Dancer2/Serializer/JSON.pm line 34. in (eval 299) l. 1"

        ### App.pm Code ###
        package TarView::App; use Dancer2; use Dancer::Exception; our $VERSION = '0.1'; set serializer => 'JSON'; get '/' => sub { template 'index'; }; get '/about' => sub { my %hash = ( records => { 1 => { Name => "Alfreds Futterkiste", City => "Berlin", Country => "Germany" }, 2 => { Name => "Ana Trujillo Empared +ados y helados", City => "México D.F.", Country => "Mexico" } } ); return \%hash; }; true;

        As I understand '/' failed to return the JSON which is true because I don't want to return JSON from '/' it should use 'template index'. Can anybody suggest how to accomplish this ?