2017-05-10 4 views
0

Um es kurz zu halten Ich erstelle eine Warenkorb-ähnliche Browser-App. Wie soll es funktionieren:Ionic: Probleme beim Anzeigen von Daten aus Array

1) Der Benutzer wählt ein Produkt aus, an diesem Punkt werden sie auf die Warenkorbseite gebracht.

  • Sie können das Produkt dort Karre hinzufügen, an welcher Stelle sie auf der Produktseite weitergeleitet werden, so dass sie ein anderes Produkt oder
  • hinzufügen können Sie die Checkout-Schaltfläche klicken und sie werden zu einer Bestellbestätigungsseite gebracht wo sie alle Elemente in ihrer Warenkorb anzeigen können

Problem: die Anordnung der Elemente in der additem() Methode zum ConfirmOrder übergeben wird, aber es wird der Ausdruck nicht

Edit: Hier ist der Arbeits c Ode. Danke @raprops auf dem ionischen Forum für die Lösung.

in meiner cart.ts Datei (Die saveItem() -Methode wird aufgerufen, wenn der Benutzer die den Warenkorb Taste

public items = []; 
// Both of these params which are to be saved in the array are passed from another page 
prodName: string = this.navParams.get('prodName'); 
prodDesc: string = this.navParams.get('prodDesc'); 

saveItem() { 

    let newItem = { 
    prodName: this.prodName, 
    prodDesc: this.prodDesc 
    }; 

    this.addItem(newItem); 
} 

addItem(item) { 

    this.items.push(item); 

    this.navCtrl.push(ConfirmOrderPage, items: this.items); 
} 

ConfirmOrder.ts

export class ConfirmOrderPage { 

    prodName; 
    items = []; 

    constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl: ModalController) { 
    } 

    ionViewDidLoad() { 
    console.log('ionViewDidLoad ConfirmOrder'); 

    this.items = this.navParams.get('items'); 
    } 
} 

ConfirmOrder.html

<ion-list> 
    <ion-item *ngFor="let item of items">{{item.prodName}}</ion-item> 
</ion-list> 
hinzufügen drückt

Antwort

0

Das OP wurde mit dem Update aktualisiert Vielen Dank an @raprops auf den ionischen Foren für die Hilfe.Der Fix war hinzuzufügen items: this.items so konnte ich das Array zugreifen auf der Empfangsseite

this.navCtrl.push(ConfirmOrderPage, items: this.items);

Verwandte Themen