如何使用Angular2中的observable从JSON多个数组(数据库中的实时数据)中获取数据

时间:2018-11-20 09:40:52

标签: json angular2-services

JSON响应如下:

{
    "clientInfo": [
        {
            "clientId": "1234",
            "clientName": "Test1234"
        },
        {
            "clientId": "4356",
            "clientName": "Test4356"
        }],
    "realTimeClientInfo": [
        {
            "clientId": "1234",
            "clientName": "Test1234",
           "Location": "Test1234",
            "Designation" :"Test1234"

        },
        {
            "clientId": "4356",
            "clientName": "Test7896",
           "Location": "Test7896",
            "Designation" :"Test7896"
        }]
        }

我想从第二个JSON数组中获取数据。

在client.component.ts中,按如下所示调用clientService:

@Input() clientInfo$: Observable<any>;
constructor(private clientService: ClientService) { }

 ngOnInit() {  this.clientInfo$ = Observable
                            .interval(1000)
                            .startWith(0).switchMap(() => 
  this.clientService.getAllInfo()); }

client.service.ts如下:

getAllInfo(): Observable<ClientInfo[]> {
    this.http.get<ClientInfo[]>('http://localhost:8080/api/auth/clientInfo'); 

在client.component.html

                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th *ngFor="let col of clientH">{{ col }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let client of clientInfo$ | async ">
                            <td *ngFor="let col of clientH"> {{client [col]}}</td>
                        </tr>
                    </tbody>
                </table>

如果JSON仅包含一个数组,则此方法有效。我们如何使用相同的逻辑从第一个数组中检索某些值,并从第二个数组中检索其他值

0 个答案:

没有答案