Angular 2可观察问题重复，而不是更新结果

Question

我正在使用基本上使用angular 2构建的Ionic2应用程序。我遇到以下可观察事件的问题，它返回所有靠近的用户..有时，当我离开查看，然后返回它使用户通过重复数据或其他时间双打它只显示1结果，并没有更新视图时，另一个用户登录，我似乎无法弄清楚是什么问题，但它的应用程序的重要部分，所以我真的需要它坚实。

Service.ts

@Injectable() 
    export class LocationTracker { 


    public nearme = <[IuserGeoLocation]>[]; 

    public firebaseRef: any; 
    public geoFire: any; 
    public space: Subject<any> = new BehaviorSubject(0); 



    constructor(public zone: NgZone, public fire:Fb, public user:User) { 
     this.fb   = fire.instance().database(); 
     this.firebaseRef = this.fb.ref('geofire'); 
     this.geoFire  = new GeoFire(this.firebaseRef); 
    } 





     UsersNearME() : Observable<any> { 

     this.nearme.length = 0; 

      let geoQuery = this.geoFire.query({ 
      center: [this.lat, this.lng], 
      radius: 4.609 //kilometers 
      }); 
      geoQuery.on("key_entered", (key, location, distance) => { 

     const sender = this.fb.ref('/users/'+ key ); 
      sender.on('value', (snapshot) => { 
       const profile = snapshot.val().profile; 
       this.nearme.push({ 
        userid: key, 
        userloc: location, 
        userdistance: distance.toFixed(2), 
        email: profile.email, 
        name: profile.displayName || 'Anonymous', 
        image: profile.photoURL || '' 
       }); 
       this.space.next(this.nearme); 
      }); 
      // console.log("User near you " + key + " found at " + location + " (" + distance + " km away)"); 
      }); 

     return this.space.asObservable(); 
     } 






    } 

Component.ts

public usersNearMe; 

    constructor(public locationTracker: LocationTracker) { 
      this.zone.run(() => { 
       this.usersNearMe = this.locationTracker.UsersNearME(); 
      }); 
    } 

component.html

<ion-content padding> 
    <!--  <ion-col class="member-item" (click)="viewUser(member.profile.uid)" width-33 *ngFor="let member of members | async; let i = index" [ngClass]="{ hideme : activeUser === member?.profile.uid }"> --> 
    <ion-grid> 
     <ion-row class="member-group" > 
      <ion-col class="member-item" tappable width-33 *ngFor="let m of usersNearMe | async; let i = index"> 
      {{ m?.userid }} 
      </ion-col> 
     </ion-row> 
    </ion-grid> 
    </ion-content> 

Answer 1

您的组件是不是真的正确设置：

组件：

export class YourComponent implements ngOnInit { 
    public usersNearMe; 

    constructor(private locationTracker: LocationTracker) {} 

    ngOnInit(){ 
     this.locationTracker.UsersNearME.subscribe(data => { 
      this.usersNearMe = data; 
     }); 
    } 
}