類型'ProvidersAppserviceProvider'（離子3）上不存在Typescript錯誤屬性'list'已解決

-1

我嘗試使用帶有離子3和角度4的CRUD時出現了一些錯誤。我正在使用Firebase。我的CLI也拋出的錯誤「未使用的導入：‘AngularFireDatabase’」和「*屬性‘列表’不上鍵入‘FirebaseListObservable’存在'*」類型'ProvidersAppserviceProvider'（離子3）上不存在Typescript錯誤屬性'list'已解決

我做了什麼錯？

錯誤

Runtime Error 
Uncaught (in promise): Error: No provider for FirebaseListObservable! Error: No provider for FirebaseListObservable! at injectionError (http://localhost:8100/build/main.js:1509:86) at noProviderError (http://localhost:8100/build/main.js:1547:12) at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19) at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25) at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25) at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21) at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:261:149) at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:396:67) at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3855:44) at resolveDep (http://localhost:8100/build/main.js:11317:45) 
Stack 
Error: Uncaught (in promise): Error: No provider for FirebaseListObservable! 
Error: No provider for FirebaseListObservable! 
    at injectionError (http://localhost:8100/build/main.js:1509:86) 
    at noProviderError (http://localhost:8100/build/main.js:1547:12) 
    at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19) 
    at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25) 
    at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25) 
    at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21) 
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:261:149) 
    at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:396:67) 
    at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3855:44) 
    at resolveDep (http://localhost:8100/build/main.js:11317:45) 
    at c (http://localhost:8100/build/polyfills.js:3:13535) 
    at Object.reject (http://localhost:8100/build/polyfills.js:3:12891) 
    at Tab.NavControllerBase._fireError (http://localhost:8100/build/main.js:44060:16) 
    at Tab.NavControllerBase._failed (http://localhost:8100/build/main.js:44048:14) 
    at http://localhost:8100/build/main.js:44103:59 
    at t.invoke (http://localhost:8100/build/polyfills.js:3:9283) 
    at Object.onInvoke (http://localhost:8100/build/main.js:4427:37) 
    at t.invoke (http://localhost:8100/build/polyfills.js:3:9223) 
    at r.run (http://localhost:8100/build/polyfills.js:3:4452) 
    at http://localhost:8100/build/polyfills.js:3:14076 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
getDataItems(): FirebaseListObservable<any> { 
    return this.pap.list('/dataItems/'); 
} 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
addItem(name) { 
    this.pap.list('/dataItems/').push(name); 
} 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
remItem(id) { 
    this.pap.list('/dataItems/').remove(id); 
} 
Ionic Framework: 3.4.2 
Ionic App Scripts: 1.3.7 
Angular Core: 4.1.3 
Angular Compiler CLI: 4.1.3 
Node: 6.11.0 
OS Platform: Windows 10 
Navigator Platform: Win32 
User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (

這裏是我的供應商

import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database'; 
import { Injectable } from '@angular/core'; 
//import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 


/* 
    Generated class for the ProvidersAppserviceProvider provider. 

    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
    for more info on providers and Angular DI. 
*/ 
@Injectable() 
export class ProvidersAppserviceProvider { 



    constructor(public pap: FirebaseListObservable<any[]>) { 
    console.log('Hello ProvidersAppserviceProvider Provider'); 
    } 



    getDataItems(): FirebaseListObservable<any> { 
    return this.pap.list('/dataItems/'); 
    } 

    addItem(name) { 
    this.pap.list('/dataItems/').push(name); 
    } 

    remItem(id) { 
    this.pap.list('/dataItems/').remove(id); 
    } 

}

我Home.ts

import { FirebaseListObservable } from 'angularfire2/database'; 
import { ProvidersAppserviceProvider } from './../../providers/providers-appservice/providers-appservice'; 
import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 


@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    dataItems: FirebaseListObservable<any[]>; 
    newItem = ''; 

    constructor(public navCtrl: NavController, public pap: ProvidersAppserviceProvider){ 
    this.dataItems = this.pap.getDataItems(); 

    } 

    addItem() { 
    this.pap.addItem(this.newItem); 
    } 

    remItem(id) { 
    this.pap.remItem(id); 
    } 

}

我app.module

import { ProvidersAppserviceProvider } from './../providers/providers-appservice/providers-appservice'; 
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 { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { AngularFireModule } from "angularfire2"; 
import { AngularFireDatabaseModule } from "angularfire2/database"; 



const fbConfig ={ 
    apiKey: "removed", 
    authDomain: "removed", 
    databaseURL: "removed", 
    projectId: "removed", 
    storageBucket: "removed", 
    messagingSenderId: "removed" 
} 

@NgModule({ 
    declarations: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp), 
    AngularFireDatabaseModule, 
    AngularFireModule.initializeApp(fbConfig), 
    HttpModule 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler}, 
    ProvidersAppserviceProvider 
    ] 
}) 
export class AppModule {}

我感謝你的幫助。 .. 。。。。。。。。。。。

來源

2017-09-16 Vin Nwaikwu

我認爲你需要，而不是注入ProvidersAppserviceProvider，這將創造一個循環依賴，注入AngularFireDatabase

@Injectable() 
export class ProvidersAppserviceProvider { 

    constructor(public pap: AngularFireDatabase) { 
     console.log('Hello ProvidersAppserviceProvider Provider'); 
    } 

    getDataItems: FirebaseListObservable<any> { 
    return this.pap.list('/dataItems/'); 
    } 

}

來源

2017-09-16 07:15:44 Sajeetharan

注入FirebaseListObservable會拋出'ERROR錯誤：Uncaught（在promise中）：錯誤： FirebaseListObservable！' –

您需要導入導入AngularFireDatabaseModule，在app.module .ts – Sajeetharan

AngularFireDatabaseModule導入app.module –

這是打算？

@Injectable() 
export class ProvidersAppserviceProvider { 

    constructor(public pap: ProvidersAppserviceProvider) { 
     console.log('Hello ProvidersAppserviceProvider Provider'); 
    } 

    ... 

}

您正在注入相同的服務。這會導致你recursive injections，並會引發錯誤。

進樣FirebaseListObservable而不是ProvidersAppserviceProvider

來源

2017-09-16 07:10:46

如何啞可我是錯過。但是現在應用程序顯示空白頁面和CLI錯誤：未使用的導入：'FirebaseListObservable' 控制檯錯誤'「未處理的Promise拒絕：提供程序解析錯誤：無法實例化循環依賴項ProvidersAppserviceProvider（」[ERROR - >]「）：in [email protected]:-1;區域：;任務：Promise.then;值：錯誤：提供程序分析錯誤：無法實例化循環依賴！ProvidersAppserviceProvider（「[ERROR - >]」）：in NgModule AppModule in ./[email protected]:-1「' @ Suren-Srapyan –

檢查您的代碼注入循環服務的位置 –

注入_'FirebaseListObservable'__拋出錯誤：_'Generic類型'FirebaseListObservable '需要1個類型參數（s）'_ –

糾正了我啞小姐出

我的供應商

import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database'; 
import { Injectable } from '@angular/core'; 
//import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 


/* 
    Generated class for the ProvidersAppserviceProvider provider. 

    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
    for more info on providers and Angular DI. 
*/ 
@Injectable() 
export class ProvidersAppserviceProvider { 



    constructor(public pap: FirebaseListObservable<any[]>) { 
    console.log('Hello ProvidersAppserviceProvider Provider'); 
    } 



    getDataItems(): FirebaseListObservable<any> { 
    return this.pap.list('/dataItems/'); 
    } 

    addItem(name) { 
    this.pap.list('/dataItems/').push(name); 
    } 

    remItem(id) { 
    this.pap.list('/dataItems/').remove(id); 
    } 

}

我Home.ts

import { FirebaseListObservable } from 'angularfire2/database'; 
import { ProvidersAppserviceProvider } from './../../providers/providers-appservice/providers-appservice'; 
import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 


@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    dataItems: FirebaseListObservable<any[]>; 
    newItem = ''; 

    constructor(public navCtrl: NavController, public pap: ProvidersAppserviceProvider){ 
    this.dataItems = this.pap.getDataItems(); 

    } 

    addItem() { 
    this.pap.addItem(this.newItem); 
    } 

    remItem(id) { 
    this.pap.remItem(id); 
    } 

}

我的應用程序。模塊

import { ProvidersAppserviceProvider } from './../providers/providers-appservice/providers-appservice'; 
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 { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { AngularFireModule } from "angularfire2"; 
import { AngularFireDatabaseModule } from "angularfire2/database"; 



const fbConfig ={ 
    apiKey: "removed", 
    authDomain: "removed", 
    databaseURL: "removed", 
    projectId: "removed", 
    storageBucket: "removed", 
    messagingSenderId: "removed" 
} 

@NgModule({ 
    declarations: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp), 
    AngularFireDatabaseModule, 
    AngularFireModule.initializeApp(fbConfig), 
    HttpModule 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler}, 
    ProvidersAppserviceProvider 
    ] 
}) 
export class AppModule {}

錯誤

Runtime Error 
Uncaught (in promise): Error: No provider for FirebaseListObservable! Error: No provider for FirebaseListObservable! at injectionError (http://localhost:8100/build/main.js:1509:86) at noProviderError (http://localhost:8100/build/main.js:1547:12) at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19) at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25) at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25) at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21) at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:261:149) at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:396:67) at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3855:44) at resolveDep (http://localhost:8100/build/main.js:11317:45) 
Stack 
Error: Uncaught (in promise): Error: No provider for FirebaseListObservable! 
Error: No provider for FirebaseListObservable! 
    at injectionError (http://localhost:8100/build/main.js:1509:86) 
    at noProviderError (http://localhost:8100/build/main.js:1547:12) 
    at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19) 
    at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25) 
    at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25) 
    at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21) 
    at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:261:149) 
    at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:396:67) 
    at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3855:44) 
    at resolveDep (http://localhost:8100/build/main.js:11317:45) 
    at c (http://localhost:8100/build/polyfills.js:3:13535) 
    at Object.reject (http://localhost:8100/build/polyfills.js:3:12891) 
    at Tab.NavControllerBase._fireError (http://localhost:8100/build/main.js:44060:16) 
    at Tab.NavControllerBase._failed (http://localhost:8100/build/main.js:44048:14) 
    at http://localhost:8100/build/main.js:44103:59 
    at t.invoke (http://localhost:8100/build/polyfills.js:3:9283) 
    at Object.onInvoke (http://localhost:8100/build/main.js:4427:37) 
    at t.invoke (http://localhost:8100/build/polyfills.js:3:9223) 
    at r.run (http://localhost:8100/build/polyfills.js:3:4452) 
    at http://localhost:8100/build/polyfills.js:3:14076 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
getDataItems(): FirebaseListObservable<any> { 
    return this.pap.list('/dataItems/'); 
} 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
addItem(name) { 
    this.pap.list('/dataItems/').push(name); 
} 
Typescript Error 
Property 'list' does not exist on type 'FirebaseListObservable<any[]>'. 
...elopment/ionic/newapp/src/providers/providers-appservice/providers-appservice.ts 
remItem(id) { 
    this.pap.list('/dataItems/').remove(id); 
} 
Ionic Framework: 3.4.2 
Ionic App Scripts: 1.3.7 
Angular Core: 4.1.3 
Angular Compiler CLI: 4.1.3 
Node: 6.11.0 
OS Platform: Windows 10 
Navigator Platform: Win32 
User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (

來源

2017-09-16 07:25:12

類型'ProvidersAppserviceProvider'（離子3）上不存在Typescript錯誤屬性'list'已解決

回答

相關問題