如何将数据传回同一页面

时间:2017-08-01 02:41:59

标签: javascript firebase ionic-framework firebase-realtime-database angularfire

我的目标是将数据传递到同一页面。我无法理解这个概念。我对离子btw还是新手。

我的request.html代码检索来自请求firebase控制台的所有请求。

<ion-header>
  <ion-navbar color="primary">
    <ion-title name="title">Job Requests</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <div class="filter">
<button class="islandwide" ion-button large>Islandwide</button>
<button class="nearby" ion-button large (click)="openMapPage()">Nearby</button>
 </div>

<ion-list>
  <ion-card *ngFor="let user of request | async" class="job">
     <button ion-item (click)="goToJobDetails(user.$key)" class="info">
    <ion-avatar class="avatar" item-start>
        <img src="../assets/icon/user_male-512.png">
    </ion-avatar>
    <h2 class="name">{{user.regdetails.username}}</h2>
    <p text-wrap class="address"><ion-icon name="compass">
         </ion-icon> {{user.regdetails.address}}</p>
    <p id="key">{{user.$key}}</p>
     </button> 
  </ion-card>
</ion-list>

</ion-content>

我的构造函数:

constructor(public navCtrl: NavController, public navParams: NavParams, 
            angFire: AngularFireDatabase) {

    this.request = angFire.list('/request');
    this.userreq = angFire.list(`${this.userkey}`);
    this.reqdetails = angFire.list('reqdetails');

  }

我的openMapPage()方法

此方法基本上会返回仅有reqdetails的所有用户,并且数据会传回request.html页面

openMapPage()
  {

  var ref = firebase.database().ref("request");
    ref.once("value").then((snapshot) => { // <------ Here!
        var a = snapshot.exists();  // true
        var c = snapshot.hasChild("reqdetails"); // true
        var d = snapshot.child('reqdetails').exists();
        var requestsKey = snapshot.key;
        var requestsValue = snapshot.val();

        snapshot.forEach((childSnapshot) => { // <------ And here!
            var requestKey = childSnapshot.key;
            var requestValue = childSnapshot.val();

            var reqdetails = requestValue.reqdetails;
            if (reqdetails) {

                this.data = requestKey;
                console.log(this.data);
                //this.arr.push(requestKey);
                //console.log(this.arr);
            }

        });
        this.navCtrl.push(RequestsPage, { 'param1': this.data });
    });


}

这是request.html从请求表中获取所有数据后的样子。这是默认视图,意味着它从firebase获取所有请求记录。

enter image description here

现在我正面临着这个问题。当用户点击并触发openMapPage()中的request.html方法时,它会重定向到openMapPage。如何将仅具有reqdetails的用户的数据重定向到同一个html页面request.html

到目前为止我已尝试过这个

this.navCtrl.push(RequestsPage, { 'param1': this.data });

但它仍然显示整个请求,这意味着它尚未被过滤。

1 个答案:

答案 0 :(得分:0)

好的,它已经解决了。

 submitform() 
  function submitform() {
     var x = Math.floor((Math.random() *50000) + 1);

      alert("The request number is"+x); 
  }