AngularJS: http request does not return anything

Question

I wanted to build a simple page for query with an input box and a button. Here is my html:

<html ng-app="cgApp" >
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="../js/controller.js"></script>
    <script src="../js/service.js"></script>

  </head>
  <body>
    <div ng-controller="CgseqCtrl">
        <input ng-model="analysisid"><button ng-click="searchById()">Search</button>
        <table>
            <tr>
                <td>{{seq.analysisId}}</td>
                <td>{{seq.center}}</td>
                <td>{{seq.diseaseAbbr}}</td>
                <td>{{seq.filepath}}</td>
                <td>{{seq.library}}</td>
            </tr>
        </table>

    </div>

  </body>
</html>

Function to handle ng-click event searchById() is implemented in my controller.js

var app = angular.module('cgApp', [])

app.controller('CgseqCtrl', ['$scope', 'Cgseq', function($scope, Cgseq){
    $scope.searchById = function() {
        Cgseq.getSeqById($scope.analysisid)
        .then(function(response){
            $scope.seq = response;
        }, function errorCallBack(response) {
            console.log(response.$statusText);
        });
    }
}]);

Cgseq is name of my factory in service.js.

app.factory("Cgseq", function ($http) {
    // return $resource('http://localhost:8080/cgweb/api/seqs/fdebfd6e-d046-4192-8b97-ac9f65dc2009');
    var service = {};
    service.getSeqById = function(analysisid) {
        return $http.get('http://localhost:8080/cgweb/api/seqs/' + analysisid);
    }
    return service;
});

When I load basic.html, type in the string for query and click the button, nothing happens in the page. I tried to debug step by step, it turns out it never got into .then or function errorCallBack. Nothing from logs of node.js server or tomcat server looks suspicious. What did I do wrong?

EDIT #1:

Based on the network status, it looks like connection to server is good (200).

Does the server actually receive the request? And if so, what do you see in the network tab of your browser's web inspector? — Sunil D.
– Sunil D., Commented Apr 7, 2016 at 16:43
@SunilD. I have uploaded screenshot of network tab. The bottom line shows the server has received the request, right? — ddd
– ddd, Commented Apr 7, 2016 at 18:42

war1oc · Accepted Answer · 2016-04-07 18:49:22Z

1

Cgseq.getSeqById($scope.analysisid)
        .then(function(response){
            $scope.seq = response.data; // You have to use response.data
        }, function errorCallBack(response) {
            console.log(response.$statusText);
        });

Reference: https://docs.angularjs.org/api/ng/service/$http

If you do a console.log(response) in the then callback you can see the structure of the response object.

answered Apr 7, 2016 at 18:49

war1oc

2,7551 gold badge19 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS: http request does not return anything

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related