CODEWITHSUNDEEP
javascriptangularjsrest
Nasreddin
Nasreddin

Reputation: 1657

REST call in AngularJS does not display record

This is my first AngularJS project. I followed this website to create a simple html to display a single record by calling restful services. The rest works with the url "http://localhost:8080/api/seqs/fdebfd6e-d046-4192-8b97-ac9f65dc2009". enter image description here

Here is my html:

<html ng-app="cgApp" ng-controller="CgseqCtrl">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-resource.js"></script>
    <script src="../js/controller.js"></script>
  </head>
  <body>
    <div>
        <hr>
            <h2>{{seq.analysisId}}</h2>
            <h2>{{seq.library}}</h2>
        </hr>
    </div>

  </body>
</html>

I defined the resource in a service js

//service.js
angular.module('cgApp', ['ngResource'])
.factory('CgseqService', function ($resource) {
        return $resource('http://localhost:8080/api/seqs/fdebfd6e-d046-4192-8b97-ac9f65dc2009',
            {get: {method: 'GET'}
        });
});

The controller:

//controller.js
angular.module('cgApp', ['ngResource'])
.controller('CgseqCtrl', ['CgseqService', '$scope', function (CgseqService, $scope)
{
    $scope.getSeq = function(response) {
        CgseqService.get(function(data) {
            $scope.seq = data;
        });
    };
}]);

When I started my http server with Node.js and typed the url in the browser, nothing is displayed. What did I do wrong?

Upvotes: 0

Views: 87

Answers (1)

Josh Beam
Josh Beam

Reputation: 19792

Several errors.

You didn't load your factory code. It looks like you only loaded your controller.js (I'm assuming your factory code is in a different file since in your example you commented it as //service.js):

  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-resource.js"></script>
    <script src="../js/controller.js"></script>
  </head>

np-controller should say ng-controller:

<html ng-app="cgApp" np-controller="CgseqCtrl">

You also never called your $scope.getSeq function:

$scope.getSeq = function(response) {
    CgseqService.get(function(data) {
        $scope.seq = data;
    });
};

You should call $scope.getSeq() somewhere to actually invoke it.

Upvotes: 1

Related Questions