CODEWITHSUNDEEP
angularfacebookfacebook-graph-api
APP Bird
APP Bird

Reputation: 1381

Angular retrieve all facebook taggable friends

I'm trying to retrieve all Facebook taggable friends of a user. Since Facebook only returns 25 friends at one time. I want to add a button to load next list of users

( I know I can increase the limit. but 25 per request is sufficient since it'll reduce user's bandwidth and speed up the website).

facebook API return "after" (cursor), "before" (cursor ) and "next" (access token) but I cannot understand how to use those in a button to retrieve next list of friends

I'm using ngx - facebook plugin https://www.npmjs.com/package/ng2-facebook-sdk

I use this function to retrieve data

 public friends() {

    this.fb.api('/me/taggable_friends?fields=name,picture.type(large)')
      .then((res: any) => {
       console.log('Got the users profile', res);
        this.fbfriends = res.data;

      })
      .catch(this.handleError);

  }

facebook return array of 25 user data , after cursor , before cursor & next = "https://graph.facebook.com/v2.9/10203919785370453/taggable_friends?access_token=xxxxxxxxxxxxxxxxx

code for user data array display on the webpage 

  <div class="card-group">
  <div class="col-5"  *ngFor="let user of fbfriends">
    <div class="card">
      <img class="card-img-top" src="{{ user.picture.data.url}}">
      <h5 class="card-title">{{ user.name }}</h5>
    </div>
  </div>
</div>

Upvotes: 0

Views: 570

Answers (1)

APP Bird
APP Bird

Reputation: 1381

I resolved issue by myself. all you need to do is get facebook api path to a string & replace this part

/me/taggable_friends?fields=name,picture.type(large)

fbnext = "https://graph.facebook.com/v2.9/10203919785370453/taggable_friends?access_token=xxxxxxxxxxxxxxxxx" 

     public friends() {

        this.fb.api(fbnext)
          .then((res: any) => {
           console.log('Got the users profile', res);
            this.fbfriends = res.data;

          })
          .catch(this.handleError);

      }

Upvotes: 0

Related Questions