Question

我正在Angular 6 + PWA中构建应用程序。我必须实施Google身份验证才能登录。当我们点击应用图标时，Google登录屏幕应该是第一个屏幕。我不希望出现Google按钮的屏幕，并且在其单击时会出现登录屏幕。发布成功后，将出现登录页面。从我可以收集到的，只有点击以下按钮，才会出现登录屏幕

<div class="g-signin2" data-onsuccess="onSignIn"></div>

当我们点击此按钮时，控制权被赋予 onSignIn（），然后流程继续进行。我希望在角度的 ngOnInit（）上调用此函数 app.component.ts 因为它是根组件。基本上我不想要以下内容：

<div class="g-signin2" data-onsuccess="onSignIn"></div>

然而我想调用它的方法onSignIn（）

我怎样才能实现这个目标？

Answer 1

在我的AuthService中，我有一个如下所示的方法：

googleLogin() {
const provider = new auth.GoogleAuthProvider()
return this.oAuthLogin(provider);
}

在您要使用的组件中，您可以执行以下操作：

import { Component, OnInit } from 
'@angular/core';
import { AuthService } from 
'../auth/auth.service';

@Component({
selector: 'user-profile',
templateUrl: './user-profile.component.html',
styleUrls: ['./user-profile.component.css']
})
export class UserProfileComponent implements 
OnInit {


constructor(public auth: AuthService) { 

}

ngOnInit() {
 this.auth.googleLogin();
}

}

不要忘记将AuthService导入到您正在使用它的组件中。

您可能没有使用Firebase，而只是通过OnInit函数中的特定身份验证api调用了Google登录方法。无需“必须”单击按钮即可调用该方法。

单击角度6的应用程序的Google身份验证屏幕

1 个答案: