首页 > 解决方案 > 如何将控制台日志数据传递到 Ionic3 和 firebase 中的对象

问题描述

我下面的代码从firebase获取所有动态数据,我想在onClick事件启动时将所有对象传递到另一个页面

public placeref = firebase.database().ref('cart');

placeOrd(){
  this.placeref
  .once('value')
  .then(snapshot => snapshot.val())
  .then(items => console.log(items)); 

}

我要传递数据的页面

  item : Item

  ionViewDidLoad() {
    console.log('ionViewDidLoad PlacedPage');
    this.navParams.get('item');

    console.log(this.navParams.get('item'));
  }

我在其中启动 placeOrd 的 Html 文件

 <ion-list *ngFor="let item of orderList$ | async">
        <ion-item>
          <ion-label text-wrap>
            <h2 style="font-weight: bold">{{item?.name}}</h2>
          <!--  <ion-input type="hidden"  [(ngModel)]="placed.name" [value]="item?.name">{{item?.name}}</ion-input>-->
            <p  style="color: black">Quantity :  {{item?.qty}}</p>
           <!-- <ion-input type="hidden"  [(ngModel)]="placed.qty" [value]="item?.qty">{{item?.qty}}</ion-input>-->
             <p style="color: black">Price :  {{item?.price}}</p>
             <p class="pr" style="font-weight: bold; color: black">Total :</p><p class="pr" style="color: red"> {{item?.total}}</p>
             <button ion-button block clear color="default" (click)="removeItem(item)" >Delete Order</button>
          </ion-label>

        </ion-item>
      </ion-list>
      <p style="color: black;">Total Vat(12%) : {{vatTotal}}</p>
      <p style="color: black">Price Subtotal : {{priceTotal}}</p>
      <label style="font-weight: bold; font-size: 18px;">Order Total :</label>
      <ion-input type="number" [value]="vatTotal + priceTotal" required="true" disabled="true" style="font-size: 18px;">{{vatTotal + priceTotal}}</ion-input>
     <button ion-button block clear (click)="placeOrd()">Submit Order</button>

控制台日志输出,其中调用了我的所有动态数据

标签: firebaseionic-frameworkfirebase-realtime-databaseionic3angularfire2

解决方案


就我而言,这非常有效。所以,你可以试试这个:

public placeref = firebase.database().ref('cart');

    placeOrd(){
      this.placeref
      .once('value')
      .then(snapshot => snapshot.val())
      .then(items => {
         this.navCtrl.push('PlacedPage',{item:items});
       }); 
    }

推荐阅读