我跟随
this tutorial.在从api.github获取用户列表的途中我得到错误:
Cannot find a differ supporting object ‘[object Object]’
我认为它与之相关
<ul> <li *ngFor = "#user of users"> {{user | json}} </li> </ul>
在我的代码中,因为在它之前没有任何错误,并且我不确定数据是否来自get请求,只是单击didnt没有给出任何错误,这是我的代码到目前为止
@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])
我认为您在响应有效负载中收到的对象不是数组。也许您要迭代的数组包含在属性中。你应该检查收到的数据的结构……
原文链接:/angularjs/143990.html你可以尝试这样的事情:
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) ); }
编辑
遵循Github文档(developer.github.com/v3/search/#search-users),响应的格式为:
{ "total_count": 12,"incomplete_results": false,"items": [ { "login": "mojombo","id": 1,(...) "type": "User","score": 105.47857 } ] }
因此,用户列表包含在items字段中,您应该使用:
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) ); }