離子2運行時錯誤無Porvider

我在app.moudule.ts離子2運行時錯誤無Porvider

import { NgModule, ErrorHandler } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { HttpModule } from '@angular/http'; 
import { MyApp } from './app.component'; 
import { IonicStorageModule } from '@ionic/storage'; 
import { InfiniteScrollModule } from 'angular2-infinite-scroll'; 

import { LoginPage } from '../pages/login/login'; 
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 { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { AuthServiceProvider } from '../providers/auth-service/auth-service'; 
import { JobsServiceProvider } from '../providers/jobs-service/jobs-service'; 
import { DataListProvider } from '../providers/data-list/data-list'; 


@NgModule({ 
    declarations: [ 
    MyApp, 
    LoginPage, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    imports: [ 
    BrowserModule, 
    HttpModule, 
    IonicModule.forRoot(MyApp), 
    IonicStorageModule.forRoot(), 
    InfiniteScrollModule 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    LoginPage, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler}, 
    JobsServiceProvider, 
    DataListProvider 
    ] 
}) 
export class AppModule {}

，並在我的文件中創建一個提供程序文件名爲數據list.ts

包括它在這裏我想用它（home.ts），其中包括它在我的構造

import { DataListProvider } from '../../providers/data-list/data-list'; 

constructor(public navCtrl: NavController,public DataListProvider: DataListProvider) {}

，但我不斷收到這個錯誤，我缺少什麼：

MyApp_Host.html:1 ERROR Error: No provider for DataListProvider! at injectionError (core.es5.js:1231) at noProviderError (core.es5.js:1269) at ReflectiveInjector_.throwOrNull (core.es5.js:2770) at ReflectiveInjector.getByKeyDefault (core.es5.js:2809) at ReflectiveInjector.getByKey (core.es5.js:2741) at ReflectiveInjector.get (core.es5.js:2610) at AppModuleInjector.NgModuleInjector.get (core.es5.js:3557) at resolveDep (core.es5.js:11017) at createClass (core.es5.js:10881) at createDirectiveInstance (core.es5.js:10701)

來源

2017-06-12 noor

您在服務類DataListProvider中添加了@Injectable（）嗎？ –

是的，我已經加了 – noor

請更新問題與你的'DataListProvider.ts'代碼 –

您需要將提供程序添加到NgModule，即在供應商module.ts，

providers: [ 
    DataListProvider 
]

來源

2017-06-12 09:31:50 Sajeetharan

，你可以看到我的問題我已經在我的ngModule – noor

增加了提供者你沒有添加 – Sajeetharan

對不起，我意識到我誤解了，我添加它，但我仍然得到相同的錯誤 – noor

需要DataListProvider在app.moudule.ts添加到供應商的名單如下：

import { DataListProvider } from '../providers/data-list/data-list'; 

     providers: [ 
     StatusBar, 
     SplashScreen, 
     {provide: ErrorHandler, useClass: IonicErrorHandler}, 
     JobsServiceProvider, 
     DataListProvider 
     ]

來源

2017-06-12 09:33:35

我添加了它，但我仍然得到相同的錯誤 – noor

你可以嘗試在你的home.js頁面中添加這個提供程序 @Component（{*****}， templateUrl：'****' ，提供程序：[DataListProvider] }） –

錯誤依然存在，它沒有任何區別 – noor

首先，你需要轉換「DataListProvider」到注射：

import {Injectable} from '@angular/core'; 

@Injectable() 
export class DataListProvider() { 
// Content Service 
}

然後將其導入列表@ NgModule提供商app.module.ts：

import {DataListProvider} from '../providers/data-list/data-list'; 

providers: [ 
StatusBar, 
SplashScreen, 
{provide: ErrorHandler, useClass: IonicErrorHandler}, 
JobsServiceProvider, 
DataListProvider 
]

如果這個解決方案並不爲你工作，你可以嘗試家庭成分轉換爲一個模塊：

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

import {Home} from './home'; 

@NgModule({ 
    imports: [CommonModule, RouterModule], 
    declarations: [Home], 
    exports: [Home] 
}) 
export class HomeModule { 
    static forRoot(): ModuleWithProviders { 
    return { 
     ngModule: HomeModule 
    }; 
    } 
}

，並導入模塊插入@ NgModule：

import {HomeModule} from './home.module.ts'; 

@NgModule({ 
    declarations: [ 
    MyApp, 
    LoginPage, 
    AboutPage, 
    ContactPage, 
    TabsPage 
    ], 
    imports: [ 
    BrowserModule, 
    HttpModule, 
    IonicModule.forRoot(MyApp), 
    IonicStorageModule.forRoot(), 
    InfiniteScrollModule, 
    HomeModule.forRoot() // -> New Module 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    LoginPage, 
    AboutPage, 
    ContactPage, 
    TabsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler}, 
    JobsServiceProvider, 
    DataListProvider 
    ] 
})

希望這能幫助你！

來源

2017-06-13 15:29:09

離子2運行時錯誤無Porvider

回答

相關問題