javascript - 如何在 Angular 应用程序中订阅 setInterval()？

Question

我正在尝试使用 Ionic 5 框架、Angular 和 Cordova 地理定位插件构建一个 iOS 位置跟踪应用程序。

我曾经使用 watchPosition() 函数来获取用户位置更改，并且它在 Android 设备上运行良好。但是，它不适用于 iOS 设备。

我的新方法是使用 getCurrentPosition() 函数结合 setInterval() 来获取当前位置。每隔一两秒获取一次更新的位置。

不幸的是，我现在收到以下错误：

TypeError：this.watchLocationUpdates.subscribe 不是函数

任何人都知道如何解决这个问题？

  watchLocation() {
    const options = {
      maximumAge: 3600000,
      timeout: 5000,
      enableHighAccuracy: true,
    };
    this.isWatching = true;
    this.trackingId =  '-' + Math.random().toString(36).substr(2, 28);

    // Please find relevant setInterval() part below
    this.watchLocationUpdates = setInterval(() => { this.geolocation.getCurrentPosition(options); }, 1000);
    this.watchLocationUpdatesSub = this.watchLocationUpdates.subscribe((resp) => {
      this.geoLocations = resp.coords;
      this.geoLatitude = resp.coords.latitude;
      this.geoLongitude = resp.coords.longitude;
      this.geoAccuracy = Math.trunc(resp.coords.accuracy);
      this.timeStamp = resp.timestamp;

      const position = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
      this.map.setCenter(position);
      this.map.setZoom(16);

      this.markers.map(marker => marker.setMap(null));
      this.markers = [];
        const latLng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
        const marker = new google.maps.Marker({
          map: this.map,
          icon: {
            path: google.maps.SymbolPath.CIRCLE,
            scale: 13,
            fillColor: '#1AA0EC',
            fillOpacity: 1,
            strokeColor: 'white',
            strokeWeight: 2
        },
          position: latLng
        });
        this.markers.push(marker);

      console.table('watchLocation function called', {
        trackingId: this.trackingId,
        latitude: this.geoLatitude,
        longitude: this.geoLongitude,
        accuracy: this.geoAccuracy,
        timeStamp: this.timeStamp,
        uId: this.uId
        });
      this.geolocationService.insertUserGeolocation({
        trackingId: this.trackingId,
        latitude: this.geoLatitude,
        longitude: this.geoLongitude,
        accuracy: this.geoAccuracy,
        timeStamp: this.timeStamp,
        uId: this.uId
        })
        .subscribe((response) => {
          localStorage.setItem('lastLocation', JSON.stringify({
            trackingId: this.trackingId,
            latitude: this.geoLatitude,
            longitude: this.geoLongitude,
            accuracy: this.geoAccuracy,
            timeStamp: this.timeStamp,
            uId: this.uId
            }));
          console.log(`user location data inserted in FB`, {
            trackingId: this.trackingId,
            latitude: this.geoLatitude,
            longitude: this.geoLongitude,
            accuracy: this.geoAccuracy,
            timeStamp: this.timeStamp,
            uId: this.uId
            });
        });
      });
  }```

标签： javascriptangulartypescriptcordovaionic-framework

Answer 1

您可以使用interval()来自 RxJS的：

// RxJS v6+
import { interval } from 'rxjs';

const source = interval(1000);

source.subscribe(/* your logic here */);