Angular 如何通过遍历Observable创建对象数组<；对象[]>；

我有一个名为

users

的Google Firestore集合，其格式如下：

{
  "contactNumber":"0123456789",
  "email":"johndoe@gmail.com",
  "location":[7.2906° N,80.6337° E],
  "isOnline":false,
  "name":"John"
}

字段

location

位于

geopint

数据类型中。我正在获取我的服务中的用户记录，如下所示：

import { Injectable } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { Observable } from 'rxjs';
import { User } from '../models/user';
import { Marker } from '../models/marker';

@Injectable({
  providedIn: 'root'
})
export class UserService {
    users: Observable<User[]>;
    markers:Marker[];

    constructor(firestore: AngularFirestore) {
       this.users = firestore.collection('users').valueChanges();
    }

    getUsers(){
       return this.users;
    }

    getUserMarkers(){

    }
}

longitute

和

latitude

字段应使用用户中的

位置

和其他相应的值，即name和isOnline进行设置。 做这件事最好的方法是什么

更新：

我用其中一个答案得出了这个结论

 getUserMarkers() {
    return this.getUsers().pipe(map(users => {
         users.map(user => {
            return {
            name: user.name,
            longitute: user.location._long,
            latitude: user.location._lat,
            isOnline: user.isOnline
            }
        });
    })); 
 }

从我试图分配给它的组件到这样的属性

export class MapComponent implements AfterViewInit {
@ViewChild("mapContainer", { static: false }) gmap: ElementRef;
map: google.maps.Map;
markers: Marker[];

constructor(private userService : UserService) {

  this.userService.getUserMarkers().subscribe(markers => {
     this.markers = markers;
   });
}

此处给出的错误

类型“void”不能分配给类型“Marker[]”。

其中我试图将数组分配给属性

this.markers=markers
那里
如果您希望将数组保持为可观察的数组，您可以使用
映射
功能以您想要的方式对数据进行格式化。该位置可能需要一些格式来去除
°N
、
°S
、
°E
和
°W

可观察的

getUserMarkers() {
    return this.getUsers().pipe(map(users => {
         return users.map(user => {
            return {
                name: user.name,
                longitute: user.geopoint._long,
                latitude: user.geopoint._lat,
                isOnline: user.isOnline
            }
        });
    })); 
 }

markerArray = [];
getUserMarkers() {
    this.getUsers().subscribe(markers => {
        this.markerArray = markers.map(user => {
          return {
            name: user.name,
            longitute: user.location[0]
            latitude: user.location[0]
            isOnline: user.isOnline
          }
        });
    }); 
}

如果需要纯数组，则需要声明一个单独的变量，并可能使用async/await方法

独立变量

getUserMarkers() {
    return this.getUsers().pipe(map(users => {
         return users.map(user => {
            return {
                name: user.name,
                longitute: user.geopoint._long,
                latitude: user.geopoint._lat,
                isOnline: user.isOnline
            }
        });
    })); 
 }

markerArray = [];
getUserMarkers() {
    this.getUsers().subscribe(markers => {
        this.markerArray = markers.map(user => {
          return {
            name: user.name,
            longitute: user.location[0]
            latitude: user.location[0]
            isOnline: user.isOnline
          }
        });
    }); 
}

异步/等待

async getUsers(){
    return this.users;
}

async getUserMarkers() {
    let markerArray = [];
    await this.getUsers().subscribe(markers => {
        markerArray = markers.map(user => {
          return {
            name: user.name,
            longitute: user.location[0]
            latitude: user.location[0]
            isOnline: user.isOnline
          }
        });
    }); 

    return markerArray;
}

是否可以从
getUserMarkers（）
）返回可观测值？@jsb9009是的，这应该是第一个选项（
返回this.getUsers（）.pipe（map（user=>{
）在第一个选项中，无法访问类型“user[]上不存在的
属性“name”字段“.
@jsb9009我更新了我的答案很抱歉出现了编译错误，因此必须在更新的问题中进行更改。请查看