Using APIs with $http Part 1

Are you ready to make your app completely dynamic by harnessing the power of APIs? Heck yes!

In this tutorial series, you'll be making a survey application that stores data in a Google Spreadsheet using the service Sheetsu.

 

Here's the final code from the end of the video:

angular.module('app.services', [])

.service('Survey', ['$http', function($http){

    var api_url = 'YOUR_SHEETSU_URL';
    var currentID = 1;

    var ret = {
        all: function(){
            
            return $http.get(api_url).then(function(resp){
                if (resp.data.length > 0) currentID = parseInt(resp.data[resp.data.length-1].id);
                return resp.data;
            });
            
        }, 
        add: function(data){
            currentID++;
            data.id = currentID;
            
            return $http.post(api_url, data).then(function(resp){
                return resp.data;
            });

        }
    }
    
    ret.all();
    
    return ret;

}]);
// The following is the constructor function for this page's controller. See https://docs.angularjs.org/guide/controller
// You can include any angular dependencies as parameters for this function
// TIP: Access Route Parameters for your page via $stateParams.parameterName
function ($scope, $stateParams, Survey, $ionicPopup) {

    $scope.data = {
        name: '',
        favorite_color: 'Orange',
        favorite_pizza: 'Pepperoni'
    }
    
    $scope.submitting = false;
    
    $scope.submit = function(){
        $scope.submitting = true;
        Survey.add($scope.data).then(function(){
            $scope.data = {
                name: '',
                favorite_color: 'Orange',
                favorite_pizza: 'Pepperoni'
            }
            $scope.submitting = false;
            
            $ionicPopup.alert({
                title: 'Thank you!',
                template: 'Your response has been recorded.'
            });
            
        })
    }

}