Mastering TypeScript 3 - Third Edition

Using Google user data

We can now focus on incorporating a Google login in our LoginPanelComponent. First up, we need to set a click handler for the Login with Google button as follows:

<button class="btn btn-primary"
    (click)="onLoginGoogleClicked()">Login with Google</button>  

Here, we have updated our login-panel.component.html file and linked the function named onLoginGoogleClicked to the click event on our form. We can then update our component itself as follows:

constructor( private userService: UserService, private router: Router, private socialAuthService: AuthService) { } onLoginGoogleClicked() { this.socialAuthService.signIn(GoogleLoginProvider.PROVIDER_ID) .then((userdata) => { this.userService.authenticateGoogleUser(userdata) .subscribe((response: ...