Angular 2 value is not updating in html

By Alaksandar Jesus Gene

I am working on an application where facebook login is required. Here is my ts file

 ngOnInit() {
    setTimeout(() => {
      this.initialize();
    })
  }
  initialize() {
    (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'));
    setTimeout(() => {
      window.fbAsyncInit =  () =>{
        FB.init({
          appId: 'your-app-id', //I gave my app id here
          cookie: true,  // enable cookies to allow the server to access
          // the session
          xfbml: true,  // parse social plugins on this page
          version: 'v2.8' // use graph api version 2.8
        });
        this.checkFBLoginStatus();
      }
    })
  }
  checkFBLoginStatus() {
    FB.getLoginStatus((response) =>{
      this.verifyResponse(response);
    });
  }
 verifyResponse(response){
    this.response = response;
   console.log(this.response) // I am getting the console output
 }

Here is my HTML

<!--For Testing purpose-->
Response is->
<p *ngIf="response">{{response.status}}</p>
<!--For Testing purpose-->
<button *ngIf="response && response.status && response.status == 'unknown'" class="btn blue fb-login-button" (click)="loginUsingFacebook()"><span class="fa fa-facebook white-text"></span>Login Using Facebook</button>
<button *ngIf="response && response.status && response.status == 'not_authorized'" class="btn blue fb-login-button" (click)="continueUsingFacebook()"><span class="fa fa-facebook white-text"></span>Continue Using Facebook</button>
<button *ngIf="response && response.status && response.status == 'connected'" class="btn blue fb-login-button" (click)="logoutFacebook()"><span class="fa fa-facebook white-text"></span>Logout Facebook</button>

The response.status is showing in console. But its not getting binded to html. And so i am not able to see the respective buttons.

I am trying to detect whether the user is logged in or if not, what is the best way i can capture the onlogin function of javascript (facebook attr) in typescript.

Thanks

Source: Stack Overflow

    

Share it with your friends!

    Fatal error: Uncaught Exception: 12: REST API is deprecated for versions v2.1 and higher (12) thrown in /home/content/19/9652219/html/wp-content/plugins/seo-facebook-comments/facebook/base_facebook.php on line 1273