離子將對象傳遞給另一個選項卡

主頁（選項卡1）。這是我想用戶從對象離子將對象傳遞給另一個選項卡

@Component({ 
     selector: 'page-home', 
     templateUrl: 'home.html', 
     providers: [Data] 
    }) 
    export class HomePage { 
      constructor(public navCtrl: NavController,public navParams: NavParams, public dataService: Data, public nativeStorage: NativeStorage) { 
     } 
     postTapped(card:any){ 
    this.dataService.setSelectedCard(card); 
     console.log(card); 
    this.navCtrl.parent.select(1); 
} 
    addPost(){ 
     this.navCtrl.push(PostPage); 
}

詳細頁標籤2.這是目標網頁，我想送的對象

@Component({ 
      selector: 'page-detail', 
      templateUrl: 'detail.html', 
     }) 
     export class DetailPage { 
    card:any; 
    constructor(public navCtrl: NavController, dataService: Data, public navParams: NavParams,) { 
     console.log(this.card); 
     this.card= dataService.getSelectedCard(); 
    } 
}

這個列表點擊一個選項稱爲數據存儲對象的供應商，我試圖將對象存儲在該服務，但對象最終通過它到達下一個標籤頁

@Injectable() 
export class Data { 
    selectedCard: any; 
    data: any; 
    posts: FirebaseListObservable<any[]>; 

    constructor(public db: AngularFireDatabase) { 
    this.posts = db.list('/posts'); 
    } 

    setSelectedCard(selectedCard:any){ 
     this.selectedCard=selectedCard; 
    } 
    getSelectedCard(){ 
     return this.selectedCard; 
    } 
}

我已經通過徹底地看着時間空帖子，找不到任何東西來解決我的問題，任何幫助將不勝感激

來源

2017-07-14 Gavin

您可以從HomePage的組件聲明中刪除提供程序：[Data]並確保已將其添加到app.module.ts的提供程序中。讓我知道結果。 –

你無法從提供者獲取數據的原因是提供者實例是你的組件類的本地。

提供者可以通過以下兩種方式之一添加。它可以被添加到單個組件是這樣的：

@Component({ 
    template: `<p>Hey!</p>`, 
    providers: [MyService] 
})

，或者它可以在全球範圍內的根組件自舉（app.module.ts）時，可以添加到應用程序：

@NgModule({ 
    declarations: [ 
    MyApp, 
    HomePage 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    ReactiveFormsModule, 
    IonicModule.forRoot(MyApp) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    HomePage 
    ], 
    providers: [ 
    Data 
    ] 
}) 
export class AppModule {}

哪這兩個你選擇可以很重要。如果將其添加到引導程序中，則會創建一個服務的單個實例，以便應用程序中的所有組件都將共享 - 這是在組件之間共享數據的好方法。如果您將提供程序添加到單個組件，那麼僅爲該組件創建一個新實例。

就你而言，由於你已經添加到你的組件中，並試圖將它放到另一個組件中，這就是爲什麼你不能獲取數據。爲了解決它，你需要讓你的提供者成爲全球的提供者。

來源

2017-07-14 14:31:51

感謝您的幫助Prerak，我改變了結構，在中間添加了一個稱爲列表頁面的頁面，然後將其鏈接到詳細信息頁面，我可以將對象傳遞給詳細信息選項卡。我現在唯一的問題是，我需要一種刷新每次重新加載標籤數據的方式。順便說一句，我希望他們保持他們獨立，所以我可以受益於有兩個選項卡，因此用戶能夠快速跳回到頁面 – Gavin

您可以執行執行操作。 –

謝謝你，這將工作，但我用下面，這使得它重新從提供者： ionViewDidEnter（）{ this.card = this.dataService.getSelectedCard（）; }）;並更改構造函數公共dataService：數據 – Gavin

離子將對象傳遞給另一個選項卡

回答

相關問題