angular rxjs
...占位
component ts
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 import {Component, OnInit} from '@angular/core'; 2 3 import { HttpClient, HttpHeaders } from '@angular/common/http'; 4 import { Observable, of } from 'rxjs'; 5 6 @Component({ 7 selector: 'app-cust', 8 templateUrl: 'customers.component.html'}) 9 export class CustomersComponent implements OnInit { 10 courses: Observable<any>; 11 configUrl = 'http://localhost:9800/ping'; 12 constructor(private http: HttpClient) {} 13 listData: {datakey: {id: string, name: string}[]}; 14 ngOnInit(): any { 15 16 this.getRes(); 17 } 18 19 getRes(): any { 20 this.http.get(this.configUrl).subscribe((res: any) => { 21 this.listData = res.datakey; 22 console.log("listData===>", this.listData.datakey); 23 }); 24 } 25 }
html
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <p>customers works!</p> 2 3 <ul> 4 <li *ngFor="let x of listData">{{x.id}} {{x.name}}</li> 5 6 </ul> 7 <button (click)="getRes()">打印console</button>
server:
server
https://www.cnblogs.com/eiguleo/p/14586927.html