0

im trying to build an instagram feed app with ionic framework and i created a factory to handle my html requests so i can use them on my controllers, thing is, with instagram API, theres a value on the json array called next_url that i need to load the Older Photos/posts so: This is my factory:

app.factory('PersonService', function($http){
var BASE_URL = "https://api.instagram.com/v1/tags/sometag/media/recent?access_token=+++";
var items = [];
var nextUrl = 0;

return {
  GetFeed: function(){
  return $http.get(BASE_URL+'&count=10').then(function(response){
    items = response.data.data;
    **nextUrl = response.data.pagination.next_url;**

    return items;

  });
},
GetNewPhotos: function(){
  return $http.get(BASE_URL+'&count=2').then(function(response){
    items = response.data.data;

    return items;
  });
},
GetOldPhotos: function(){
  return $http.get(**nextUrl**).then(function(response){
    items = response.data.data;
    return items;
  });
}
}
});

I want to use the nextUrl = response.data.pagination.next_url; from GetFeed function to get the next_url and use it on the GetOldPhotos function that will use the nextUrl to load the older photos, i dont think i can return 2 values from the same function and i think $scope isnt an option in factory.

I know there could be more than one way to achieve this but i just started with ionic, angular, and javascript and im realy stuck here and would be great if i could get some "guidance" :D Sorry for any grammar, syntax, or any other error in this post and thank you in advance!

3
  • I'm not sure but since the variable item and nextUrl is in the factory, can't your code work without returning 2 of those? Commented Jul 1, 2015 at 2:46
  • Hi lcycool, thanks for the interest, as for the solution I dont see how i can get the nextUrl without returning it, i tested it earlier by just returning the items and i couldnt get to the nextUrl Commented Jul 1, 2015 at 2:54
  • we resolved this issue in this post: stackoverflow.com/q/31166195/5067669 Commented Jul 8, 2015 at 17:43

2 Answers 2

1

You can assign value to private variables in your factory without returning.

var app = angular.module('test', []);

app.factory('PersonService', function($http) {
  var BASE_URL = "https://api.instagram.com/v1/tags/sometag/media/recent?access_token=+++";
  var items = [];
  var nextUrl = 0;

  return {
    GetFeed: function() {
      return $http.get1(BASE_URL + '&count=10').then(function(response) {
        items = response.data.data;
        nextUrl = response.data.pagination.next_url;
      });
    },
    GetNewPhotos: function() {
      return $http.get1(BASE_URL + '&count=2').then(function(response) {
        items = response.data.data;
      });
    },
    GetOldPhotos: function() {
      return $http.get1(nextUrl).then(function(response) {
        items = response.data.data;
      });
    }
  }
});

app.controller('Test', function($scope, $http, $q, $timeout, PersonService) {
  // DO NOT COPY
  // adding function in $http for demo purpose only
  $http.get1 = function(url) {
      var d = $q.defer();

      $scope.status = "requesting URL " + url + " (fake)...";

      $timeout(function() {
        d.resolve({
          data: {
            data: ["data 1", "data 2"],
            pagination: {
              next_url: "this is next url"
            }
          }
        });
      }, 1000);

      return d.promise;
    }
    // END DO NOT COPY

  $scope.person = PersonService;
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>

<div ng-app='test' ng-controller='Test'>
  <button type="button" ng-click="person.GetFeed()">GetFeed</button>
  <button type="button" ng-click="person.GetNewPhotos()">GetNewPhotos</button>
  <button type="button" ng-click="person.GetOldPhotos()">GetOldPhotos</button>
  <br>{{status}}
</div>

Sign up to request clarification or add additional context in comments.

2 Comments

Hey Lcycool, thanks for the time and yes, after testing i can get to the nextUrl without returning it in the GetFeed function however i'm getting an infinite loop with my code so i guess im doing most of it wrong.
We resolved the issue in this post: stackoverflow.com/q/31166195/5067669 thank you for the answer Lcycool, im fact, theres no need to return to access those variables inside the factory :)
1

You could return an object from GetFeed() with both values:

return {items: items,
 nextUrl = response.data.pagination.next_url
};

Or an array:

return [items, response.data.pagination.next_url];

And then pass that back on to GetOldPhotos as a parameter. I would let the caller hold state.

Are you saying that when you set the nextUrl variable in GetFeed, it's not available in the getOldPhotos function? That surprises me. It should work.

4 Comments

Hey Robert, thanks for the answer, but how can i access that array from the GetOldPhotos function? return $http.get(nextUrl).then(function(response){} could it be like: GetFeed().nextUrl? i cant test it right now
Hi again Robert, you are absolutely right! after testing the nextUrl i can access it in the GetOldPhotos function, however things are not working the way i want it so i guess i have most of the code wrong for my needs. since your an experienced stackoverflow user, would be better if i create a new question with all my code in question or should i do it in this question? Thank you alot for ur time
Yes ask a new question.
HI again Robert, i did it just now on this question: stackoverflow.com/q/31166195/5067669

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.