Ionic 2 X页面错误是2个模块声明的一部分 [英] Ionic 2 Error of X page is part of the declarations of 2 modules

问题描述

我在这里经历过SO问题。但我无法得到这个错误试图建议的内容。请帮我解决这个问题。

I had gone through SO questions over here. But I am Unable to get What this error is trying to suggest. Please Help me out for this.

最后，HIGHER MODULE表示哪个模块。因为我是新手这就是为什么不能正确得到这个。

Lastly, HIGHER MODULE Means which module. As I am new to this That is why Not getting this correctly.

Mycode：

app.module。 ts

app.module.ts

   @NgModule({
  declarations: [
    MyApp,
    UsersPage,
    ReposPage,
    OrganisationsPage,
    UserDetailsPage,
    LoginPage

  ],
  imports: [

    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),

  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    LoginPage,
    UsersPage,
    ReposPage,
    OrganisationsPage,
    UserDetailsPage,


  ],

Login.module.ts

Login.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule,IonicPage } from 'ionic-angular';
import { LoginPage } from './login';
//import { IonicPage } from 'ionic-angular';

@IonicPage()
@NgModule({
  declarations: [
    LoginPage,
  ],
  imports: [
    IonicPageModule.forChild(LoginPage),
  ],
  entryComponents: [
    LoginPage
  ],
  exports: [
    LoginPage
  ]
})
export class LoginPageModule {}

根据您的评论更新代码

app.module。 ts

app.module.ts

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { AuthService } from '../../providers/auth-service';


@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {
  loading: Loading;
  registerCredentials = { email: '', password: '' };

  constructor(private nav: NavController, private auth: AuthService, private alertCtrl: AlertController, private loadingCtrl: LoadingController) { }

  public createAccount() {
    this.nav.push('RegisterPage');
  }

  public login() {
    this.showLoading()
    this.auth.login(this.registerCredentials).subscribe(allowed => {
      console.log(allowed)
      if (allowed) {        
        this.nav.setRoot('HomePage');
      } else {
        this.showError("Access Denied");
      }
    },
      error => {
        this.showError(error);
      });
  }

  showLoading() {
    this.loading = this.loadingCtrl.create({
      content: 'Please wait...',
      dismissOnPageChange: true
    });
    this.loading.present();
  }

  showError(text) {
    this.loading.dismiss();

    let alert = this.alertCtrl.create({
      title: 'Fail',
      subTitle: text,
      buttons: ['OK']
    });
    alert.present(prompt);
  }
}

login.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule,IonicPage } from 'ionic-angular';
import { LoginPage } from './login';
//import { IonicPage } from 'ionic-angular';


@NgModule({
  declarations: [
    LoginPage,
  ],
  imports: [
    IonicPageModule.forChild(LoginPage),
  ],
  entryComponents: [
    LoginPage
  ],
  exports: [
    LoginPage
  ]
})
export class LoginPageModule {}

login.ts

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController, Loading, IonicPage } from 'ionic-angular';
import { AuthService } from '../../providers/auth-service';


@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {
  loading: Loading;
  registerCredentials = { email: '', password: '' };

  constructor(private nav: NavController, private auth: AuthService, private alertCtrl: AlertController, private loadingCtrl: LoadingController) { }

  public createAccount() {
    this.nav.push('RegisterPage');
  }

  public login() {
    this.showLoading()
    this.auth.login(this.registerCredentials).subscribe(allowed => {
      console.log(allowed)
      if (allowed) {        
        this.nav.setRoot('HomePage');
      } else {
        this.showError("Access Denied");
      }
    },
      error => {
        this.showError(error);
      });
  }

  showLoading() {
    this.loading = this.loadingCtrl.create({
      content: 'Please wait...',
      dismissOnPageChange: true
    });
    this.loading.present();
  }

  showError(text) {
    this.loading.dismiss();

    let alert = this.alertCtrl.create({
      title: 'Fail',
      subTitle: text,
      buttons: ['OK']
    });
    alert.present(prompt);
  }
}

推荐答案

我假设您正在使用Ionic的Lazy Load功能。该错误的含义是，您在声明数组中包含 LoginPage > NgModule 都在 AppModule （ app.module.ts 文件）和 LoginPageModule 。

I assume you're using the Lazy Load feature of Ionic. What that error means, is that you're including the LoginPage in the declarations array of the NgModule both in the AppModule (app.module.ts file) and the LoginPageModule.

为了解决此问题，请删除 LoginPage 声明 AppModule ，如果你需要在应用程序的某个地方使用 LoginPage （例如，如果你想要推送那个页面），使用名称但作为字符串，如下所示：

In order to fix it, remove the LoginPage declaration of the AppModule, and if you need to use the LoginPage somewhere in the app (for instance, if you want to push that page), use the name but as a string, like this:

// Somewhere in your app
this.navCtrl.push('LoginPage'); // <- The name of the page is used as a string

由于页面名称现在是一个字符串，你将不再需要导入 LoginPage

Since the name of the page is now a string, you won't need to import the LoginPage anymore

// import { LoginPage } from '/path/to/login-page.ts'; <- You won't need to do this anymore

---

更新

就像你可以在 docs （感谢@suraj），请检查您是否正在创建 LoginPage 的模块，如下所示：

Just like you can see in the docs (thanks @suraj), please check that you're creating the module of the LoginPage like this:

@NgModule({
  declarations: [
    MyPage
  ],
  imports: [
    IonicPageModule.forChild(MyPage)
  ],
  entryComponents: [
    MyPage
  ]
})
export class MyPageModule {}

并检查您是否正在添加 @IonicPage（）装饰到页面：

And also check that you're adding the @IonicPage() decorator to the page:

// Ionic
import { IonicPage } from 'ionic-angular';

@IonicPage()
@Component({...})
export class MyPage {}

这篇关于Ionic 2 X页面错误是2个模块声明的一部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！