Facebook SDK สำหรับ JavaScript กับ AngularJS

คุณสามารถรวม Facebook SDK สำหรับ JavaScript กับ AngularJS ได้ แต่เราไม่เสนอโมดูล AngularJS เนื่องจาก SDK ของเราต้องทำงานให้กับเว็บ ไม่ใช่ให้กับกรอบการทำงานเฉพาะใดๆ

การโหลด Facebook SDK สำหรับ JavaScript

หากต้องการเพิ่ม Facebook SDK สำหรับ JavaScript ลงในแอพ ขอแนะนำให้ทำตามวิธีการรับรองความถูกต้อง Facebook ในแอพเว็บ AngularJS หรือคู่มืออื่นๆ ที่โพสต์ใน https://docs.angularjs.org/guide

ใช้ SDK เวอร์ชันล่าสุด

ขณะทำตามคู่มือ โปรดโหลดไฟล์ SDK ล่าสุดsdk.js ดังนี้:

// Old SDK (deprecated)
js.src = "https://connect.facebook.net/en_US/all.js";

// New SDK (v2.x)
js.src = "https://connect.facebook.net/en_US/sdk.js";

และระบุเวอร์ชัน API กราฟ (ปัจจุบันคือ v2.4) ในการเรียก FB.init() ดังนี้

$window.fbAsyncInit = function() {
    FB.init({ 
      appId: '{your-app-id}',
      status: true, 
      cookie: true, 
      xfbml: true,
      version: 'v2.4'
    });
};

การจัดการการเรียกกลับ

Facbeook SDK สำหรับ JavaScript ไม่รองรับแนวคิดสัญญา คุณสามารถแก้ไขปัญหาโดยรวมการเรียก Facbeook SDK สำหรับ JavaScript (เป็นต้น) ในบริการ ดังนี้

// ...
.factory('facebookService', function($q) {
    return {
        getMyLastName: function() {
            var deferred = $q.defer();
            FB.api('/me', {
                fields: 'last_name'
            }, function(response) {
                if (!response || response.error) {
                    deferred.reject('Error occured');
                } else {
                    deferred.resolve(response);
                }
            });
            return deferred.promise;
        }
    }
});

ใช้การบริการเป็นตัวอย่างดังนี้

$scope.getMyLastName = function() {
   facebookService.getMyLastName() 
     .then(function(response) {
       $scope.last_name = response.last_name;
     }
   );
};

ไลบรารีบุคคลภายนอก

มีไลบรารีบุคคลภายนอกหลายรายการที่ทำให้การใช้งาน Facebook SDK สำหรับ JavaScript ง่ายขึ้นซึ่งระบุไว้ในหน้าคู่มือ AngularJS