【问题标题】:getting Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays无法找到“对象”类型的不同支持对象“[对象对象]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays
【发布时间】:2018-01-01 05:36:10
【问题描述】:

我想在文本框上实现自动完成功能,因为我创建了返回 Json 格式文件的 Web API,但我得到“找不到类型为 'object' 的不同支持对象 '[object Object]'。NgFor 仅支持绑定到诸如数组之类的可迭代对象。” 请同样帮助我

我的代码:=

服务

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';
@Injectable()
export class ClientSearchService {

endPoint: string;
constructor(private http: Http) {
    this.endPoint = "http://localhost:57888/api/Employees/GetEmployeeById";
}
search(term: string): Observable<any[]> {
    var ClientList = this.http.get(this.endPoint + '/' + term)       
        .map((r: Response) => { return (r.json().length != 0 ? r.json() : [{ "ClientId": 0, "ClientName": "No Record Found" }]) as any[] });        
        return ClientList;
}
}

应用组件.ts

    import { Component, OnInit, Output, Input, EventEmitter } from '@angular/core';
    import { Observable, Subject } from 'rxjs';
    import { ClientSearchService } from './_services/client-search.service';
    @Component({
      selector: 'client-search',
      templateUrl: './app.component.html',
    })
    export class AppComponent implements OnInit {
      public clients: Observable<any[]>;
      private searchTerms = new Subject<string>();
      public ClientName = '';
      public flag: boolean = true;
      constructor(
        private clientSearchService: ClientSearchService,
      ) {

      }

      ngOnInit(): void {
        this.clients = this.searchTerms
          .debounceTime(300)    
          .distinctUntilChanged()  
          .switchMap(term => term   
            ? this.clientSearchService.search(term)
            : Observable.of<any[]>([]))
          .catch(error => {
            console.log(error);
            return Observable.of<any[]>([]);
          });
      }
      searchClient(term: string): void {
        this.flag = true;
        this.searchTerms.next(term);
      }
      onselectClient(ClientObj) {   
        if (ClientObj.ClientId != 0) {
          this.ClientName = ClientObj.ClientName;     
          this.flag = false;
        }
        else {
          return false;
        }
      }

    }

HTML

        </div>        
    </div>
    <div class="search-result" *ngIf="flag">
        <ul>
            <li *ngFor="let client of clients | async">
                //<a (click)="onselectClient(client)">{{client.ClientName}}</a>
            </li>           
        </ul>
    </div>

我的json文件如下

{"ClientId":15,"ClientName":"Abhinav Singh"}

【问题讨论】:

    标签: angular


    【解决方案1】:

    由于错误表明您的结果客户不是 array ,它是一个 objectngFor Objects

    的数组

    要修复它,请将您的 JSON 文件更改为

    [{"ClientId":15,"ClientName":"Abhinav Singh"}]

    【讨论】:

      猜你喜欢
      • 2020-08-29
      • 2023-01-26
      • 1970-01-01
      • 1970-01-01
      • 2019-09-08
      • 2018-07-14
      • 2017-02-10
      • 1970-01-01
      相关资源
      最近更新 更多