title: Getting loginStatus from facebook in AngularJS ( returning data in factory )
body: <p>I'm creating a mobile app in angularJS ( i'm at the very beginning ) and currently trying to get login status from FB API. This is my <strong>app with controller</strong>:</p>
  
  <pre><code>var myApp = angular.module('myApp',['ngRoute']);
  
  
  myApp.config(['$routeProvider', 
      function($routeProvider) {
  
      $routeProvider
      .when('/',{
          templateUrl: 'views/first.html',
          controller: 'FirstCtrl',
          requireLogin : false
      })
      .when('/second', {
          templateUrl: 'views/second.html',
          controller: 'SecondCtrl',
          requireLogin : true
      });
  }]);
  myApp.controller('FirstCtrl', function($scope,Auth) {
      $scope.data = Auth.authorize();
  });
  </code></pre>
  
  <p><strong>my factory</strong></p>
  
  <pre><code>myApp.factory('Auth', function() {
  
      return {
          authorize: function() {
              return FB.getLoginStatus(function(response) {
                   if (response.status == 'not_authorized') {
                       return 'test';
                   }
                   return 'test2';
              });
          }
      };
  });
  </code></pre>
  
  <p><strong>scripts</strong> :</p>
  
  <pre><code>&lt;script src="http://connect.facebook.net/en_US/all.js"&gt;&lt;/script&gt;
          &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js'&gt;&lt;/script&gt;
          &lt;script src="http://code.angularjs.org/1.2.4/angular-route.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
              FB.init({
                  appId: { my app id }, // App ID
                  status: true, // check login status
                  cookie: true, // enable cookies to allow the server to access the session
                  xfbml: true,  // parse XFBML
                  oauth: true
              });
  
          &lt;/script&gt;
          &lt;script src="js/app.js"&gt;&lt;/script&gt;
          &lt;script src="js/controllers.js"&gt;&lt;/script&gt;
          &lt;script src="js/services.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>and <strong>first.html</strong></p>
  
  <pre><code>Some text, and here is the loginStatus: {{ data }}
  
  &lt;a href='#/second'&gt;Second Page&lt;/a&gt;
  </code></pre>
  
  <p>and currently the place with {{ data }} is empty, so I guess the first mistake is way of returning the data in my factory, but I don't really know how to fix this.</p>