EXAMPLE: Accessing facebook graph API with angular 1.0.0rc2

3,438 views
Skip to first unread message

Mykhailo Kotsur

unread,
Mar 28, 2012, 4:45:35 PM3/28/12
to ang...@googlegroups.com
Hola!

I'm writing an app which heavily communicates with facebook thru their JS SDK and I thought it may be good to give a basic example for everybody who interested.

So, here you have: 
Mike

Igor Minar

unread,
Mar 29, 2012, 12:59:50 AM3/29/12
to ang...@googlegroups.com
nice!

I would recommend some changes, see: http://jsfiddle.net/IgorMinar/Hxbqd/5/

especially using $apply in your service instead of $digest in the controller is quite important.

cheers,
Igor

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/sEFZ05vMkPMJ.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.

Mykhailo Kotsur

unread,
Mar 29, 2012, 3:03:10 AM3/29/12
to ang...@googlegroups.com
Hi Igor,

Sorry, but after your changes it doesn't work anymore :-)

                    FB.api('/me'function($rootScope.$apply(success});

Here facebook passes us user into callback and we need to pass it further to success handler. But as I understood from $apply documentation, the only parameter 'success' func. can have is scope.

FB.api('/me'function(user$rootScope.$apply(success(user)});

On Thursday, 29 March 2012 06:59:50 UTC+2, Igor Minar wrote:
nice!

I would recommend some changes, see: http://jsfiddle.net/IgorMinar/Hxbqd/5/

especially using $apply in your service instead of $digest in the controller is quite important.

cheers,
Igor

On Wed, Mar 28, 2012 at 1:45 PM, Mykhailo Kotsur <mic...@gmail.com> wrote:
Hola!

I'm writing an app which heavily communicates with facebook thru their JS SDK and I thought it may be good to give a basic example for everybody who interested.

So, here you have: 
Mike

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/sEFZ05vMkPMJ.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+unsubscribe@googlegroups.com.

Peter Bacon Darwin

unread,
Mar 29, 2012, 5:14:29 AM3/29/12
to ang...@googlegroups.com
It would seem to me you would be better just wrapping the whole response handler to the FB.login call in a $apply call: http://jsfiddle.net/Hxbqd/6/

By the way, this blows up if you try to run it a second time when you are already logged in, I suspect because in this case the response handler is executed immediately in the same call stack as call to askFacebookForAuthentication, which means that $apply has already been called.  This is a tricky situation where the FB api is not consistent - i.e. if the user is already logged in then the response handler is called synchronously (inside the current $apply) but if otherwise it calls it asynchronously (without a $apply wrapper).

Thinking aloud: I thought we could get around this by $defering the execution of the call but it doesn't like it.


Pete



To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/k8jFd2rd2J0J.

To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.

Igor Minar

unread,
Mar 29, 2012, 10:12:39 AM3/29/12
to ang...@googlegroups.com
On Thu, Mar 29, 2012 at 2:14 AM, Peter Bacon Darwin <pe...@bacondarwin.com> wrote:
It would seem to me you would be better just wrapping the whole response handler to the FB.login call in a $apply call: http://jsfiddle.net/Hxbqd/6/

yes, that's it. I was just quickly hacking on this while riding a shuttle. my bad. :-)

 

By the way, this blows up if you try to run it a second time when you are already logged in, I suspect because in this case the response handler is executed immediately in the same call stack as call to askFacebookForAuthentication, which means that $apply has already been called.  This is a tricky situation where the FB api is not consistent - i.e. if the user is already logged in then the response handler is called synchronously (inside the current $apply) but if otherwise it calls it asynchronously (without a $apply wrapper).

Thinking aloud: I thought we could get around this by $defering the execution of the call but it doesn't like it.

I wonder why not.

btw an alternative solution would be to use $q and return a promise from the api, that would hide the sync/async inconsistency of the FB api.

/i

br...@builtbyprime.com

unread,
Sep 20, 2012, 6:26:03 PM9/20/12
to ang...@googlegroups.com
I have been working through this lately for an app I'm working on. I built a service to handle this that can be seen here:


:)


Pete



Igor

To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/k8jFd2rd2J0J.

To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.

Mark Strefford

unread,
Jan 13, 2013, 4:03:20 PM1/13/13
to ang...@googlegroups.com, br...@builtbyprime.com
Hi,

I'm also have some challenges with getting the Facebook SDK to work with Angular.  I've tried this http://jsfiddle.net/bradbirdsall/ggmRQ/ and it works ok on jsfiddle.net.  However, when I copy the code locally and run it, I get "Error: $apply already in progress"

This happens whether I am logged in or logged out of Facebook.

Am I missing something?

Regards

Mark.
Message has been deleted

Mark Strefford

unread,
Jan 15, 2013, 5:16:54 AM1/15/13
to ang...@googlegroups.com, br...@builtbyprime.com
I have it working now.  Key thing is to use this jsfiddle http://jsfiddle.net/bradbirdsall/ggmRQ/6/ !!



On Thursday, September 20, 2012 11:26:03 PM UTC+1, br...@builtbyprime.com wrote:

Raúl Jiménez

unread,
Apr 7, 2013, 12:33:58 PM4/7/13
to ang...@googlegroups.com, br...@builtbyprime.com
Hi all,

I'm having the problem that Peter mentioned (my second call seems to broke the callback), so I tried with the Brad example and it's happening the same.

Here's my JavaScript code, sorry, no HTML, but is very simple.

The main problem is that my second call to FB.api (on FriendDetailController) is not executed, so it seems that FB.api callbacks are broken because I'm not doing something right.

I'm stuck with this since two days ago, I have been read a lot and I don't know what to do. I don't know if I'm doing something wrong on Angular or Facebook, because I'm quite noob to both of them.

I hope that a kind soul have mercy and could help me :)

Best

Raul

Raúl Jiménez

unread,
Apr 7, 2013, 3:27:49 PM4/7/13
to ang...@googlegroups.com, br...@builtbyprime.com
Sorry, here's my JS code, I forget to put the link :)


I hope it helps.
Reply all
Reply to author
Forward
0 new messages