0

I tried to use ionic infinite to load more item,

doRefresh(event) {
    console.log('Begin async operation');  
    setTimeout(() => {
      this.nextpage()
      console.log("test")
      event.target.complete();
    
    }, 2000);
}
nextpage(){   
    this.datanum = this.datanum+5;
    this.sqliteDB.getAttractionsbycondition(this.sql,this.datanum).then(res => {
      this.alldata_new = res   
      this.alldata_new.forEach(element => {
        this.geocoder.geocode({ 'address': element.Address },  (results, status)  => { //先找到當地的經緯度 
          let pos;
          if (status == google.maps.GeocoderStatus.OK) {
              pos = {                                         //目標經緯度
                lat: results[0].geometry.location.lat(),
                lng: results[0].geometry.location.lng()
              };    
         

              if(google.maps.geometry.spherical.computeDistanceBetween(new google.maps.LatLng(pos.lat, pos.lng), new google.maps.LatLng(this.exampleLat,this.exampleLng))>=1000){
    
                 this.distance = google.maps.geometry.spherical.computeDistanceBetween(new google.maps.LatLng(pos.lat, pos.lng), new google.maps.LatLng(this.exampleLat,this.exampleLng))/1000;
                 this.distance = Math.round(this.distance);
                 if(this.distance>this.data.distance){
                    console.log("too far");
                    this.alldata_new.splice(this.alldata_new.indexOf(element),1);
                 } 
                 this.distance = this.distance +"kilometer";
                 element.distance = this.distance;
                 
               }else{
                this.distance = google.maps.geometry.spherical.computeDistanceBetween(new google.maps.LatLng(pos.lat, pos.lng), new google.maps.LatLng(this.exampleLat,this.exampleLng));
                this.distance = Math.round(this.distance);
                if(this.distance/1000>this.data.distance){
                  console.log("too far");
                  this.alldata_new.splice(this.alldata_new.indexOf(element),1);
               } 
                this.distance = this.distance +"meter";
                element.distance = this.distance;
              }
               // 四捨五入
              // });                
          }  
          else{
            element.Aname = "failure";
          }   
        });
      }); 
      
    })
    
    
    console.log(this.alldata+"hello ")     
  }

Here's the result picture,the problem is It did work and load more items, but the information I want them to show disappeared, but I did check the console.log and the new loaded item did push into my data,so I wonder what could be the problem? enter image description here

chungchung
  • 27
  • 3
  • Hello! It's very hard to see what's going on by just taking a look at that code. Do you think you could create a Stackblitz demo with the most relevant parts of the code? You can use this **[this starter](https://stackblitz.com/edit/ionic-5-starter-app?file=src/app/app.component.ts)** if you want :) – sebaferreras Dec 01 '20 at 16:55
  • I used the link you gave me , perhaps because I am new to the tool , I can't seem to save the file , Every time I pressed forked it just did not work and the save button also can't be pressed . Do you know what the problem is? – chungchung Dec 02 '20 at 01:50

0 Answers0