初學者,我是第一次嘗試使用 API,
這就是我所說的:
url = 'https://data.economie.gouv.fr/api/records/1.0/search/?dataset=prix-carburants-fichier-instantane-test-ods-copie&q=aire sur l'adour&lang=fr&facet=id&facet=adresse&facet=ville&facet=prix_maj&facet=prix_nom&facet=com_arm_name&facet=epci_name&facet=dep_name&facet=reg_name&facet=services_service&facet=horaires_automate_24_24&refine.ville=Aire-sur-l'Adour';
datas = [];
constructor(private http: HttpClient){
this.http.get(this.url).toPromise().then((data: any) => {
this.datas = data
})
}
和 HTML:
<pre class="text-white">
{{ datas | json }}
</pre>
所以它顯示了這樣的 JSON:
[結果][1]
現在,我如何訪問它? 我已經嘗試過類似的事情:
let data of datas :
data.records
data[0][records]
etc
我很抱歉這個菜鳥問題,我只是想了解它是如何作業的 [1]:https ://i.stack.imgur.com/oQOlD.png
uj5u.com熱心網友回復:
這是一個示例,其中 json 屬性 rappresents 您的整個物件:
<span *ngFor="let element of json.records">
{{element.datasetid }}
{{element.geometry }}
{{element.recordid }}
</span>
uj5u.com熱心網友回復:
在這里,請嘗試創建一個新方法并使用 async/await。
創建一個類似這樣的新方法 -
public async getData()
{
await this.http.get(this.URL)
.toPromise()
.then(response => this.datas = response['records'])
.catch(err => { console.log ('error');
});
}
現在,您可以從建構式中呼叫此方法,如下所示 -
constructor(private http: HttpClient) {
this.getData()
}
現在,您應該使用 *ngFor 指令來遍歷資料,因為它是一個陣列,因此您可以使用這些資料來開發 HTML。
<div *ngFor="let data of datas">
{{data?.fields?.id}}
</div>
這樣,您就可以使用此 . 如果您需要任何進一步的幫助,請告訴我。
請找到 stackblitz 的作業鏈接- https://stackblitz.com/edit/angular-dukmlc?file=src/app/app.component.ts
謝謝你。
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/495941.html
上一篇:如何在api中定位元素?
