Using ngDreamFactory module: Getting angular error "cannot get property getResources of undefined"

I need help understanding how to call a function defined via the the swagger definition file from a service in angular using the ngDreamFactory module.

I have followed the angular Trivia App that uses the ngDreamFactory angular module. I got the angular todo example to work fine, but that does not use ngDreamFactory. I am interested in using swagger and the ngDreamFactory module.

I am trying to call getResources using the ngDreamFactory angular module but I keep getting different variants of “TypeError: Cannot read property ‘getResources’ of undefined”.

I have a service set up as “talosapi” that has this swagger definition file. (auto-generated by DF)

{
   "swaggerVersion":"1.2",
   "apiVersion":"1.0",
   "basePath":"http://localhost:8080/rest",
   "resourcePath":"/talosapi",
   "produces":[
      "application/json",
      "application/xml"
   ],
   "consumes":[
      "application/json",
      "application/xml"
   ],
   "apis":[
      {
         "path":"/talosapi",
         "operations":[
            {
               "method":"GET",
               "summary":"getResources() - List all resources.",
               "nickname":"getResources",
               "type":"Resources",
               "event_name":[
                  "talosapi.list"
               ],
               "responseMessages":[
                  {
                     "code":400,
                     "message":"Bad Request - Request does not have a valid format, all required parameters, etc."
                  }, etc etc

What am I missing with regard to the Dreamfactory.api.talosapi.getResources call?

How does the notation: DreamFactory.api.(service?).(Resource?) relate to the swagger definition file. Where is this documented?

Note: I am not authenticating first because I need to integrate with an existing site, are the ngDreamFactory api functions dependent on authentication?

app.factory('profilesSvc', function($resource, DreamFactory, $q) {

    function _getProfiles() {

        var defer = $q.defer();

         DreamFactory.api.talosapi.getResources(
            function (data) {
                defer.resolve(data);
            },
            function (data) {

                defer.reject(data);
            });

        return defer.promise;
    }   etc etc..

WIth thanks
Espen

Maybe your swagger cache didn’t reset. Go to the services page, pick any service, and update it. That will force a swager cache rebuild. Let me know if that works, we can look into why its not doing that on a save of a remote web service.

By the way, make sure your swagger json file is in the “custom” directory, not the cache directory, as that directory gets blown away when the cache rebuilds.

Thank you for your reply, Jason.

I have made a service to interface to an SQL database. I tested the service in the LiveAPI (Works fine).

I did not have a talosapi.json file in swagger custom, though I have tried that too now by taking the raw data from LiveAPI and making a file. (Still get a undefined error in the DreamFactory.api.talosapi.getResources line)

Reading the angular-dreamfactory.js is unfortunately not easy for me. I do need some documentation or explanation of how to use the ngDreamFactory module. The fact that the following works in the Trivia app is what i’m looking for.

Is there some more documentation available with regard to the angular module that anyone has found? Is, it the missing authorization that halts initialization?

service.js: ‘MovieService’:

        DreamFactory.api.movies.getMovies({"q": _generateSearchTerm()},

            function (data) {
                defer.resolve(data);
            },
            function (data) {

                defer.reject(data);
            });

        return defer.promise;

movies.json:

{
   "swaggerVersion":"1.2",
   "apiVersion":"1.0",
   "basePath":"http://localhost:8080/rest",
   "resourcePath":"/movies",
   "produces":[
      "application/json"
   ],
   "consumes":[
      "application/json"
   ],
   "apis":[
      {
         "path":"/movies",
         "operations":[
            {
               "method":"GET",
               "summary":"Get a recordset of movies based on a query parameter",
               "nickname":"getMovies",
               "type":"Movies",
               "parameters":[
                  {
                     "name":"q",
                     "description":"Movie name as a string",
                     "allowMultiple":false,
                     "type":"string",
                     "paramType":"query",
                     "required":true
                  }
               ], etc etc

We are using swagger.js as the basis for building this, so you could always look at Wordnik’s Swagger-JS documentation. When you the SDK is being built , look in the debugger of your browser. Do the contents of the JSON pulled for your service match what you have put in?

Also in your controller, make sure you are listening for api:ready.

This is certainly interesting!

Bit of a learning curve for me.

Ill keep going some more to see if I can get this up and running. After trying DreamFactory, I do want to use swagger as a basis of my angular frontend work.

Sincerely
Espen

I got a result finally - but still a ways to go - Ill write up what I didn’t understand if (when) I have success.

And thank you Jason for your time. I do appreciate it!

Sincerely
Espen

I am looking for a way to get the ngDreamFactory module to initialize and then to get out of the way.

The Trivia example uses a single $scope.$on(‘api:ready’, function (e) to broadcast a function call.

How do I efficiently use this design approach?

I want the controllers to be able to call data from the respective services without listening for any broadcasting. Can I restrict the api:ready checking to the service? Can the api initialize so that all the services are available to the controllers - avoiding the undefined error?

I am far from an angular expert and thus I am at a loss at how to use the module. Any help would be appreciated.

Should it not be sufficient for the ngDreamFactory service to communicate with my services with promises without the need for broadcasting?

Sincerely
Espen

Controller

app.controller('WallPostsCtrl',  function($scope, wallPostsSvc, $q) {
    $scope.title = "My Wall";
    
    $scope.$on('api:ready', function (e) {

        wallPostsSvc.getWallPosts().then(
            function (result) {
                $scope.wallposts = result.record;
                console.log('Success');
                console.log(result);

            }, function (reason) {
                console.log('Error');
                console.log(reason);
            });
    });  

});

service

app.factory('wallPostsSvc', function (DreamFactory, $q) {

        function _getWallPosts() {

            var defer = $q.defer();
                
            DreamFactory.api.talosapi.getRecords({"table_name":"profile_wall_posts"},
                function (data) {
                    defer.resolve(data);
                },
                function (data) {

                    defer.reject(data);
                });

            return defer.promise;
        }            

        return {

            getWallPosts: function () {
            
                var defer = $q.defer();

                _getWallPosts().then(
                    function (result) {

                        defer.resolve(result);

                    },
                    function (reason) {

                        defer.reject(reason)

                    });

                return defer.promise;
            }
        }
    }); 

Sure can, use a resolve map on your route instead of listening.

https://docs.angularjs.org/api/ngRoute/provider/$routeProvider

Started on a new promises based SDK , its currently here : Still Alpha, log issues there:

Can you please explain how to use “resolve map on your route instead of listening”. I am able to get the data using “$scope.$on(‘api:ready’, function (e)”. But it is not loading the data when i move between pages.

Hi @jayp, I have reviewed the link that @Jason provided to the AngularJS documentation, and it describes what a resolve map is. If you have further Angular questions I recommend reviewing their documentation. If the issue you’re having is caused by the DSP, please provide a more full description so we can help you.

Jeff,
please provide examples on how this would work. Just referring to the not-so-good doc of AngularJS is not helping much.
Peter

I’m sorry @peter_hirt, I don’t have further examples for you. I will see if I can find anything with some Google searching, but I recommend contacting the AngularJS team since you’ve found the documentation on https://angularjs.org to be sub-par.