Angular and PhoneGap Event Queuing

Question

I have this:

app.factory('contacts', function ($rootScope, $q, cordovaReady) {
    return {
        find: cordovaReady(function (filter) {
            var deferred = $q.defer();

            var options = new ContactFindOptions();
            options.filter = filter;
            options.multiple = true;
            var fields = ["displayName", "name", "addresses", "emails"];
            navigator.contacts.find(fields, function (contacts) {
                $rootScope.$apply(function () {
                    deferred.resolve(contacts);
                });

            }, function (error) {
                $rootScope.$apply(function () {
                    deferred.reject(error);
                });
            }, options);

            return deferred.promise;
        })
    };

and

app.factory('cordovaReady', function () {
    return function (fn) {

        var queue = [];

        var impl = function () {
            queue.push(Array.prototype.slice.call(arguments));
        };

        document.addEventListener('deviceready', function () {
            queue.forEach(function (args) {
                fn.apply(this, args);
            });
            impl = fn;
        }, false);

        return function () {
            return impl.apply(this, arguments);
        };
    };
});

Whenever I call from the controller:

var contactSearch = '';
contacts.find(contactSearch).then(function (contacts) {
    $scope.contacts = contacts;
}, function (error) {
    console.log(error);
});

I get:

ReferenceError: ContactFindOptions is not defined
    at Object.<anonymous> 

I made sure to wrap the function with cordovaReady. Why is this happening?

Answer 1

Can you go through this answer - Uncaught ReferenceError: ContactFindOptions is not defined

Also make sure that your app.js should be included after cordova.js or phonegap JS in index.html.

I also suggest use ng-cordova wrapper for contact plugin.

1. include ng-cordova.js before your js in index file.
2. Inject ngCordova to your app module.
3. Inject $cordovaContacts to your service/factory.

For more visit http://ngcordova.com/

Ex.

 var services = angular.module("services", ['ngCordova']);
    services.service('contact', contact);
    function contact($cordovaContacts, $q) {
        return {
            find : function() {
                var deferred = $q.defer();
                var options = {};
                options.filter = "";
                options.multiple = true;
                $cordovaContacts.find(options).then(function(contacts) {
                    for (var i = 0; i < contacts.length; i++) {
                        if (null != contacts[i].phoneNumbers) {
                            for (var j = 0; j < contacts[i].phoneNumbers.length; j++) {

                                alert(contacts[i].phoneNumbers[j].value);
                                if (null != contacts[i].emails) {
                                    alert(contacts[i].emails[0].value);
                                } 
                                alert(contacts[i].displayName);
                            }
                        }
                        deferred.resolve();
                    }, function(err) {
                deferred.reject();
                alert("error in contact find");
            });
            return deferred.promise;
          };
    };

Hope this answer help you.