Reputation: 5029
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).
Upvotes: 0
Views: 305
Reputation: 2755
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.
Upvotes: 1