初始化ionic 4之前无法访问“ LoginPageModule”

时间:2019-12-02 08:17:22

标签: angular ionic-framework ionic4

我正在尝试为ionic 4应用插入google登录,每次单击登录按钮时都遇到问题have a problem like this

Cannot access 'LoginPageModule' before initialization

和我来自login.page.ts的代码如下

import { Component, OnInit } from '@angular/core';
import { NavController } from '@ionic/angular';
import { GooglePlus } from '@ionic-native/google-plus';

@Component({
  selector: 'app-login',
  templateUrl: './login.page.html',
  styleUrls: ['./login.page.scss'],
})
export class LoginPage{

  displayName: any;
  email: any;
  familyName: any;
  givenName: any;
  userId: any;
  imageUrl: any;

  isLoggedIn:boolean = false;

  constructor(
    public navCtrl: NavController,
    public googlePlus: GooglePlus
  ) { }

  login() {
    this.googlePlus.login({})
      .then(res => {
        console.log(res);
        this.displayName = res.displayName;
        this.email = res.email;
        this.familyName = res.familyName;
        this.givenName = res.givenName;
        this.userId = res.userId;
        this.imageUrl = res.imageUrl;
        this.isLoggedIn = true;
      })
      .catch(err => console.error(err));
  }

  logout() {
    this.googlePlus.logout()
      .then(res => {
        console.log(res);
        this.displayName = "";
        this.email = "";
        this.familyName = "";
        this.givenName = "";
        this.userId = "";
        this.imageUrl = "";

        this.isLoggedIn = false;
      })
      .catch(err => console.error(err));
  }

  ngOnInit() {

  }

}

我尝试了不同的方法,但仍然遇到此错误,有人知道如何解决吗?

这是login.module.ts,我之前没有接触过,但是LoginPageModule在这里,所以问题出在这里?

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { LoginPage } from './login.page';

const routes: Routes = [
  {
    path: '',
    component: LoginPage
  }
];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [LoginPage]
})
export class LoginPageModule {}

1 个答案:

答案 0 :(得分:2)

由于使用的是Ionic 4,因此必须在导入目录字符串中添加/ngx。正确的导入将是-

login.page.ts

import { GooglePlus } from '@ionic-native/google-plus/ngx';

您还需要像这样将GooglePlus添加到模块提供商-

login.module.ts

...
import { GooglePlus } from '@ionic-native/google-plus/ngx';

...

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [LoginPage],
  providers: [GooglePlus]
})
export class LoginPageModule {}