I have added QQoutesPage in Ionic, if I add in app.modules.ts at the #NgModule list I am getting the Error saying
QQoutesPage is part of the declarations of 2 modules: AppModule and
QQoutesPageModule!*
if I remove the QQoutesPages from the #NgModules list I am getting --
Error: Component QQoutesPage is not part of any NgModule or the module
has not been imported into your module.
app/modules.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 { FavoritesPage } from '../pages/favorites/favorites';
import { LibraryPage } from '../pages/library/library';
import { QuotePage } from '../pages/quote/quote';
import { SettingsPage } from '../pages/settings/settings';
import { tabsPage } from '../pages/tabs/tabs';
import { QQoutesPage } from '../pages/q-qoutes/q-qoutes';
import { QuotesServices } from '../services/quotes';
#NgModule({
declarations: [
MyApp,
FavoritesPage,
LibraryPage,
QuotePage,
SettingsPage,
tabsPage ,QQoutesPage,
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
FavoritesPage,
LibraryPage,
QuotePage,
SettingsPage,
tabsPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
QuotesServices,QQoutesPage
]
})
export class AppModule {}
Related
i've been trying to fix this for some hours now. My ionic app while running keeps bringing this error 'No provider for http client'. i have added a HttpModule and also included it in imports f my app.module.ts but still get this dreaded error.
import { NgModule, ErrorHandler } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { HttpModule } from '#angular/http';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import { SettingsPage } from '../pages/settings/settings';
import { StatusBar } from '#ionic-native/status-bar';
import { SplashScreen } from '#ionic-native/splash-screen';
import { WeatherProvider } from '../providers/weather/weather';
#NgModule({
declarations: [
MyApp,
AboutPage,
ContactPage,
HomePage,
TabsPage,
SettingsPage
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp),
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
AboutPage,
ContactPage,
HomePage,
TabsPage,
SettingsPage
],
providers: [
HttpModule,
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
WeatherProvider
]
})
export class AppModule {}
Actually Discovered that i was including 'httpModule'instead of 'httpClient' .
i fixed it by replacing it in my code
import { NgModule, ErrorHandler } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { HttpModule } from '#angular/http';
import { HttpClient } from '#angular/common/http';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import { SettingsPage } from '../pages/settings/settings';
import { StatusBar } from '#ionic-native/status-bar';
import { SplashScreen } from '#ionic-native/splash-screen';
import { WeatherProvider } from '../providers/weather/weather';
#NgModule({
declarations: [
MyApp,
AboutPage,
ContactPage,
HomePage,
TabsPage,
SettingsPage
],
imports: [
BrowserModule,
HttpClient,
HttpModule,
IonicModule.forRoot(MyApp),
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
AboutPage,
ContactPage,
HomePage,
TabsPage,
SettingsPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
WeatherProvider
]
})
export class AppModule {}
Error:
I am facing a problem when I run the code via ionic serve
I get an error of
Runtime error: Cannot find module "."
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 { SigninPage } from '../pages/auth/signin/signin';
import { SignupPage } from '../pages/auth/signup/signup';
import { LandingPage } from '../pages/landing/landing';
import { AuthService } from '../services/auth.service';
#NgModule({
declarations: [
MyApp,
SigninPage,
SignupPage,
LandingPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
providers: [
StatusBar,
SplashScreen,
AuthService,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
I haven't mention the entrycomponents
and all the components contains the default code. AuthService is also empty
If I remove the AuthService form Providers in app.module file Code runs succesfully. But if I have to access the authService I must provide it in the Providers
IonicPageModule is missing from your project.
In your app.module.ts include
import { IonicPageModule } from 'ionic-angular';
And your import should looks like this:
imports: [
BrowserModule,
IonicPageModule.forChild(HomePage)
IonicModule.forRoot(MyApp)
],
after that run npm run-script build
NOTE: IonicPageModule is an NgModule that bootstraps a child IonicPage in order to set up routing.
Why do I get this error?
Error: No component factory found for DatabaseProvider. Did you add it
to #NgModule.entryComponents?
I tried to add my provider to the entryComponents, but still not working.
database.ts
import { HttpClient } from '#angular/common/http';
import { Injectable } from '#angular/core';
import { Storage } from '#ionic/storage';
#Injectable()
export class DatabaseProvider {
localData: any;
constructor() {
console.log('Database provider iniciado ..');
}
}
My settings
, With this provider i'm trying to make a local storage, but I can't use this provider.
app.module.ts
import { NgModule, ErrorHandler } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { StatusBar } from '#ionic-native/status-bar';
import { SplashScreen } from '#ionic-native/splash-screen';
import { DatabaseProvider } from '../providers/database/database';
import { IonicStorageModule } from '#ionic/storage';
#NgModule({
declarations: [
MyApp,
InicioPage,
SimuladorPage,
NosotrosPage,
CuestionarioPage,
CuestinarioPorCompetenciaPage,
PersonalizadoPage,
CRUDPage,
NormasPage,
CategoriasPage,
VerCategoriasPage,
PreguntasPage,
AlternativasPage,
FeedbackPage
],
imports: [
BrowserModule,
IonicModule.forRoot(DatabaseProvider),
IonicStorageModule.forRoot()
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
InicioPage,
SimuladorPage,
NosotrosPage,
CuestionarioPage,
CuestinarioPorCompetenciaPage,
PersonalizadoPage,
CRUDPage,
NormasPage,
CategoriasPage,
VerCategoriasPage,
PreguntasPage,
AlternativasPage,
FeedbackPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
DatabaseProvider
]
})
export class AppModule {}
I just had to make a new project ....
I have an Ionic 2 application where I make use of Storage.
When I start the app, it crashes with the error message: Can't resolve all parameters for Storage: (?, ?).
I can't seem to find the error, who can help me?
app.module.ts
import { NgModule, ErrorHandler } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { Storage } from '#ionic/storage';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { EthylenePage } from '../pages/ethylene/ethylene';
import { PropylenePage } from '../pages/propylene/propylene';
import { TemporaryResultPage } from '../pages/temporary-result/temporary-result';
import { TabsPage } from '../pages/tabs/tabs';
import { StatusBar } from '#ionic-native/status-bar';
import { SplashScreen } from '#ionic-native/splash-screen';
#NgModule({
declarations: [
MyApp,
AboutPage,
ContactPage,
EthylenePage,
PropylenePage,
TemporaryResultPage,
HomePage,
TabsPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
AboutPage,
ContactPage,
PropylenePage,
EthylenePage,
TemporaryResultPage,
HomePage,
TabsPage
],
providers: [
{provide: ErrorHandler, useClass: IonicErrorHandler},
StatusBar,
SplashScreen,
Storage
]
})
export class AppModule {}
In my package.json I have added this to my dependencies section:
"#ionic/storage": "1.1.7"
Please check this http://ionicframework.com/docs/storage/
The documentation state
import { IonicStorageModule } from '#ionic/storage';
and
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
IonicStorageModule.forRoot()
],
You don't need to add Storage on providers part
When running ionic serve I am getting an error in the browser No Provider for TabsPage.
The TabsPage is listed in the app.module.tsfile:
import { NgModule, ErrorHandler } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { CalendarPage } from '../pages/calendar/calendar';
import { NewsPage } from '../pages/news/news';
import { SettingsPage } from '../pages/settings/settings';
import { TabsPage } from '../pages/tabs/tabs';
import { StatusBar } from '#ionic-native/status-bar';
import { SplashScreen } from '#ionic-native/splash-screen';
import { OneSignal } from '#ionic-native/onesignal';
import { AppVersion } from '#ionic-native/app-version';
import { Calendar } from '#ionic-native/calendar';
import { GoogleAnalytics } from '#ionic-native/google-analytics';
import { InAppBrowser } from '#ionic-native/in-app-browser';
import { SecureStorage } from '#ionic-native/secure-storage';
import { Toast } from '#ionic-native/toast';
import { CalendarProvider } from '../providers/calendar/calendar';
import { SettingsProvider } from '../providers/settings/settings';
import { ConnectivityProvider } from '../providers/connectivity/connectivity';
import { NewsProvider } from '../providers/news/news';
import { CommonFunctionsProvider } from '../providers/common-functions/common-functions';
#NgModule({
declarations: [
MyApp,
CalendarPage,
NewsPage,
SettingsPage,
AboutPage,
ContactPage,
HomePage,
TabsPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
AboutPage,
ContactPage,
HomePage,
CalendarPage,
NewsPage,
SettingsPage,
TabsPage
],
providers: [
StatusBar,
SplashScreen,
OneSignal,
AppVersion,
Calendar,
GoogleAnalytics,
InAppBrowser,
SecureStorage,
Toast,
{provide: ErrorHandler, useClass: IonicErrorHandler},
SettingsProvider,
CalendarProvider,
ConnectivityProvider,
NewsProvider,
CommonFunctionsProvider
]
})
export class AppModule {}
For a page this error occurs, when you initialize this specific page in another like so:
constructor (public tabs: TabsPage) {}
If you have a provider that you want to initialize in a constructor, you need to declare it in the app.module.ts under providers: [].