Facebook JS SDK with Angular JS

I have a site which used both the Facebook JS SDK and Angular JS. In one of the controllers i'm trying to call the Facebook SDK but I always receive FB is not defined.

This is how I add Facebook:

<script>

    window.fbAsyncInit = function () {
        FB.init({
            appId: FacebookManager.facebookAppId,
            status: true,
            xfbml: true,
            version: 'v2.1'
        });

        //check to see if there is a logged in user
        if (User.isUserActive()) {
            //check if the user is connected to facebook properly
            FB.getLoginStatus(FacebookManager.statusChangeCallback);
        }
    };

    (function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {
            return;
        }
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

</script>

I have a feeling that because the controller is being called before the Facebook async loading has finished - the FB variable is not yet set.

What is the right approach for that ?