如何将 json 数据重塑为另一种格式

Question

所以我从我的 API 中以这种格式获取数据：

[
    {
        "lattitude": 52.57812538272844,
        "longitude": -1.7111388218750108,
    },
    {
        "lattitude": 53.043884,
        "longitude": -2.923782,
    }
]

我需要数据看起来像这样，所以纬度必须是 'lat' 经度必须是 'lng' 等

[{
            lat: 52.57812538272844,
            lng: -1.7111388218750108,
        },
        {
            lat: 52.3602160,
            lng: 4.8891680,
}]

我知道缺少一些数据，稍后我会修复这个问题。有没有办法在不改变 API 的情况下做到这一点。我在 .net 后端使用 Angular-nativescript

Answer 1

你的数据是静态的吗？或者它是可观察的？

假设它是静态的，利用数组上的 map 运算符。它将一个数组转换为一个新数组。

const data = [
    {
        "lattitude": 52.57812538272844,
        "longitude": -1.7111388218750108,
    },
    {
        "lattitude": 53.043884,
        "longitude": -2.923782,
    }
];

const dataYouWant = data.map((point: any) => ({lat: point.lattitude, lng: point.longitude }));

如果它是可观察的，请告诉我，我也可以在这方面为您提供帮助。

Answer 2

jsonData = jsonData.map(item => ({ lat: item.lattitude, lng: item.longitude }));

或

function renameProp(obj, oldPropName, newPropName) {
  obj[newPropName] = obj[oldPropName];
  delete obj[oldPropName];
}

jsonData.forEach(item => {
  renameProp(item, "lattitude", "lat");
  renameProp(item, "longitude", "lng");
});

Answer 3

我想出了一种使用 Nativescript + Angular 的方法，类似于上面的方法。在上面的方法中我遇到了错误，但在这个方法中没有错误

这是我使用的代码

// Code to get the data
getBusinesses() {
    let baseUrl = environment.apiUrl + 'business/locations'
    this.http.get(baseUrl).subscribe(response => {
// Once you have your response from the api, send the data to the createData function
        this.createData(response)
    }, error => {
        console.log(error)
    });
}

// Code to map the data
createData(data) {
    var newData = data.map(item => ({
            lat: item.lattitude,
            lng: item.longitude,
            title: item.address,
            subtitle: item.description,
    }))
    console.log(newData)
}

这是新的输出

JS: [{
JS:   "lat": 52.57812538272844,
JS:   "lng": -1.7111388218750108,
JS:   "title": "Non deserunt labore sunt ex laboris et adipisicing ullamco officia minim.",
JS:   "subtitle": "test"
JS: }, {
JS:   "lat": 53.043884,
JS:   "lng": -2.923782,
JS:   "title": "Non deserunt labore sunt ex laboris et adipisicing ullamco officia minim.",
JS:   "subtitle": "test"
JS: }]

如何将 json 数据重塑为另一种格式

How to reshape json data into another format

json

angular

typescript

nativescript

nativescript-angular