angular 2将angular2-social-login添加到登录组件

时间:2017-11-26 20:41:07

标签: angular

我开始以角度2工作我只是在开始。我正在尝试使用google,facebook,linkedin登录,我正在尝试将此实现到我的组件 但是我收到了错误 - "没有提供e!"

这是我的login.ts:

import { Component, Injectable} from '@angular/core';

import { AuthService } from "angular2-social-login";
import { BrowserModule } from '@angular/platform-browser';
import { Angular2SocialLoginModule } from "angular2-social-login";


@Injectable()
class User {
    email: string;
    password: string;
} 

let providers = {
    "google": {
        "clientId": "i have google client id"
    }
};
@Component({
    selector: 'cv-login',
    templateUrl: './login.component.html',
    styleUrls: ['./login.component.css'],
    providers: [User]
})

export class LoginComponent {
    about: User;
    sub: any;
    constructor(public _auth: AuthService) {
        console.log(this.about.email);
    }

    signIn(provider: string) {
        this.sub = this._auth.login(provider).subscribe(
            (data) => {
                console.log(data);
                //user data 
                //name, image, uid, provider, uid, email, token (accessToken for Facebook & google, no token for linkedIn), idToken(only for google) 
            }
        )
    }

    logout() {
        this._auth.logout().subscribe(
            (data) => { console.log(data); this.about = null; }//{//return a boolean value.} 
        )
    }
}

Angular2SocialLoginModule.loadProvidersScripts(providers);

这是我的HTML:

<div> 
    <h1>Angular2 Social login</h1>
    <button (click)="signIn('google')">google</button>
    <button (click)="signIn('linkedin')">linkedIn</button>
    <button (click)="signIn('facebook')">facebook</button>
    <button (click)="logout()">logout</button>
    <div *ngIf="about">
        <table>
            <tr>
                <td>Email</td>
                <td>{{about.email}}</td>
            </tr>
        </table>
    </div>
</div>

我不明白,为什么它会给我一个错误?

0 个答案:

没有答案