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

问题描述

我在这里解决了一些问题.但我无法得到这个错误试图暗示什么.请帮我解决这个问题.

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.

我的代码:

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 的延迟加载功能.该错误的意思是，您在 AppModule 的 NgModule 的 declarations 数组中包含 LoginPagecode>(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.

为了修复它，删除 AppModule 的 LoginPage 声明，如果您需要在应用程序的某处使用 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 {}

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