Angular:找不到不同的支持对象“[object Object]" [英] Angular: Cannot find a differ supporting object '[object Object]'

问题描述

我正在关注 本教程.在从 api.github 获取用户列表的过程中，我收到错误:

<块引用>

找不到不同的支持对象 '[object Object]'

我认为它与

有关

 
<li *ngFor = "#user of users">{{用户 |json}}

在我的代码中，因为在它之前没有任何错误，而且我不确定数据是否来自获取请求，只是点击没有给出任何错误，这是我的代码到目前为止

@Component({选择器:'路由器'，管道:[]，模板:`<div><form [ngFormModel] = "searchform"><input type = 'text' [ngFormControl]='input1'/></表单><按钮(点击)=getusers()">提交</button>

<div><ul><li *ngFor = "#user of users">{{用户 |json}}

<路由器插座></路由器插座>`，指令:[FORM_DIRECIVES]})出口类路由器{搜索表单:控制组；用户:数组<对象>[]；input1:抽象控件；构造函数(公共http:Http，fb:FormBuilder){this.searchform = fb.group({'输入1':['']})this.input1 = this.searchform.controls['input1']}获取用户(){this.http.get(`https://api.github.com/搜索/用户?q=${this.input1.value}`).map(response => response.json()).订阅(数据 =>this.users = 数据，错误 =>控制台日志(错误))}}引导程序(路由器，[HTTP_PROVIDERS])

解决方案

我认为您在响应负载中收到的对象不是数组.也许您要迭代的数组包含在一个属性中.您应该检查接收到的数据的结构...

你可以试试这样的:

getusers() {this.http.get(`https://api.github.com/search/users?q=${this.input1.value}`).map(response => response.json().items)//<------.订阅(数据 =>this.users = 数据，错误 =>控制台日志(错误));}

编辑

按照 Github 文档(developer.github.com/v3/search/#search-users)，响应的格式是:

<代码>{"total_count": 12,不完整的结果":假，项目": [{"登录": "mojombo",身份证":1，(……)"type": "用户",分数":105.47857}]}

因此用户列表包含在 items 字段中，您应该使用它:

getusers() {this.http.get(`https://api.github.com/search/users?q=${this.input1.value}`).map(response => response.json().items)//<------.订阅(数据 =>this.users = 数据，错误 =>控制台日志(错误));}

Im following this tutorial. On the way to get list of users from api.github Im getting error:

Cannot find a differ supporting object '[object Object]'

I think its related to

 <ul>
 <li *ngFor = "#user of users">
 {{user | json}}
 </li>
 </ul>

In my code because before it there was no any error, and im unsure if data come from get request, just clicking didnt give any error, here is my code so far

@Component({
selector: 'router',
pipes : [],

template: `
<div>
<form [ngFormModel] = "searchform">
      <input type = 'text' [ngFormControl]= 'input1'/>
</form>
     <button (click) = "getusers()">Submit</button>
</div>
<div>
<ul>
    <li *ngFor = "#user of users">
    {{user | json}}
    </li>
</ul>
</div>
<router-outlet></router-outlet>
`,
directives: [FORM_DIRECTIVES]
})
export class router {
searchform: ControlGroup;
users: Array<Object>[];
input1: AbstractControl;

constructor(public http: Http, fb: FormBuilder) {
    this.searchform = fb.group({
        'input1': ['']
    })
    this.input1 = this.searchform.controls['input1']
}
getusers() {
    this.http.get(`https://api.github.com/
search/users?q=${this.input1.value}`)
        .map(response => response.json())
        .subscribe(
        data => this.users = data,
        error => console.log(error)
        )
}
}
bootstrap(router, [HTTP_PROVIDERS])

解决方案

I think that the object you received in your response payload isn't an array. Perhaps the array you want to iterate is contained into an attribute. You should check the structure of the received data...

You could try something like that:

getusers() {
  this.http.get(`https://api.github.com/search/users?q=${this.input1.value}`)
    .map(response => response.json().items) // <------
    .subscribe(
      data => this.users = data,
      error => console.log(error)
    );
}

Edit

Following the Github doc (developer.github.com/v3/search/#search-users), the format of the response is:

{
  "total_count": 12,
  "incomplete_results": false,
  "items": [
    {
      "login": "mojombo",
      "id": 1,
      (...)
      "type": "User",
      "score": 105.47857
    }
  ]
}

So the list of users is contained into the items field and you should use this:

getusers() {
  this.http.get(`https://api.github.com/search/users?q=${this.input1.value}`)
    .map(response => response.json().items) // <------
    .subscribe(
      data => this.users = data,
      error => console.log(error)
    );
}

这篇关于Angular:找不到不同的支持对象“[object Object]"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！