Error: Can't resolve all parameters for EditPage: ([object Object], [object Object], [object Object], ?)


#1

I have this error:

Error: Can’t resolve all parameters for EditPage: ([object Object],
[object Object], [object Object], ?).

This is the typescript of EditPage (edit.ts):

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { HomePage } from "../home/home";
import { IconsPage } from '../icons/icons';

@Component ({
  selector: 'page-edit',
  templateUrl: 'edit.html'
})

export class EditPage {
  position: number;
  notification = this.homePage.allNotifications[this.position];
  newDoneText: string = 'Hecho';
  newCancelText: string = 'Cancelar';

  constructor(public navCtrl: NavController,
              public iconsPage: IconsPage,
              public navParams: NavParams,
              public homePage: HomePage,
  ) {
    this.position = navParams.get('position');
  }

  openIcons() {
    this.navCtrl.push(IconsPage);
  }

  changeThisIconName() {
    this.notification.iconName = this.iconsPage.returnIconName();
  }
}

And that’s the function that’s put EditPage (home.ts):

openEdit() {
    this.navCtrl.push(EditPage, {position: this.positionEditNotificationInAllNotifications});
  }

¿What’s happend?


#2

Injecting one page in another page makes no sense. Take both iconsPage and homePage out of that constructor. Do any communication between pages via a mutually injected service provider.


#3

Thank’s for your fast!!!

I see it now and I tell you!


#4

I put providers but the app is with the same error:

edit.ts

import { Component, Injectable } from '@angular/core';
import { NavController} from 'ionic-angular';
import { NavParams } from "ionic-angular";

import { HomePage } from "../home/home";
import { IconsPage } from '../icons/icons';

@Component ({
  selector: 'page-edit',
  templateUrl: 'edit.html',
  providers: [IconsPage, HomePage]
})

@Injectable()

export class EditPage {
  homePage: HomePage;
  iconsPage: IconsPage;
  position: number;
  activeOrFinalized: boolean;
  notification = this.homePage.allNotifications[this.position];
  newDoneText: string = 'Hecho';
  newCancelText: string = 'Cancelar';

  constructor(public navCtrl: NavController,
              public navParams: NavParams,
  ) {
    this.position = navParams.get('position');
    this.activeOrFinalized = navParams.get('activeOrFinalized')
  }

  openIcons() {
    this.navCtrl.push(IconsPage);
  }

  changeThisIconName() {
    this.notification.iconName = this.iconsPage.returnIconName();
  }
}

home.ts

import { Component, Injectable } from '@angular/core';
import {
  NavController,
  ActionSheetController,
  Platform
} from 'ionic-angular';

import { SettingsPage } from "../settings/settings";
import { CreatePage } from "../create/create";
import { EditPage } from "../edit/edit";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  providers: [SettingsPage, CreatePage, EditPage]
})

@Injectable()

The call (home.ts):

openEditAndPassParams() {
    this.navCtrl.push(EditPage, {
      position: this.positionEditNotification,
      activeOrFinalized: this.isActiveOrFinalizedNotification
    });
  }

I change this part before add providers.

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { SettingsPage } from '../pages/settings/settings';
import { CreatePage } from "../pages/create/create";
import { IconsPage } from "../pages/icons/icons";
import { EditPage } from "../pages/edit/edit";

@NgModule({
  declarations: [
    MyApp,
    SettingsPage,
    CreatePage,
    IconsPage,
    HomePage,
    EditPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    SettingsPage,
    CreatePage,
    IconsPage,
    HomePage,
    EditPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

What’s now?


#5

Completely forget about attempting to have page A interact directly with page B. Instead follow the design patterns described in here. Providers provide data, not pages. Incidentally, you almost never want a providers array on a specific page - that will result in separate instances of the provider on each page that does so.


#6

Ok, thank’s I whatch it!