Angular 角度：找不到不同的支撑对象'；[对象对象]'；

我跟在后面。在从api.github获取用户列表的过程中，Im获取错误：

找不到不同的支持对象“[object]”

我认为这与

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

{{user | json}}

在我的代码中，因为在此之前没有任何错误，并且我不确定数据是否来自get请求，只需单击并没有给出任何错误，这是我到目前为止的代码

@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])

@组件({
选择器：'路由器'，
管道：[]，
模板：`
提交


{{user | json}}


`,
指令：[格式指令]
})
出口级路由器{
搜索形式：对照组；
用户：数组[]；
输入1：抽象控制；
构造函数（公共http:http，fb:FormBuilder）{
this.searchform=fb.group({
'输入1'：['']
})
this.input1=this.searchform.controls['input1']
}
getusers（）{
这是http.get(`https://api.github.com/
搜索/用户？q=${this.input1.value}`）
.map（response=>response.json（））
.订阅(
data=>this.users=data，
error=>console.log（错误）
)
}
}
引导（路由器，[HTTP\U提供程序]）

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

你可以试试这样的方法：

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)
    );
}

因此，用户列表包含在

项目
字段中，您应该使用以下内容：

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)
    );
}

getusers（）{
这是http.get(`https://api.github.com/search/users?q=${this.input1.value}`）
.map（response=>response.json（）.items）//this.users=data，
error=>console.log（错误）
);
}
我在代码中收到了这个错误，因为我没有运行JSON.parse（result）

所以我的结果是一个字符串，而不是一个对象数组

i、 e.我得到：

"[{},{}]" 

而不是：

[{},{}]


输入属性周围缺少方括号可能会导致此错误。
例如：

Component Foo {
    @Input()
    bars: BarType[];
}

正确：


不正确（触发错误）：

我不止一次发现页面上有另一个同名变量

例如，在下面的示例中，
NgFor
的数据位于变量
requests
中。
但是if-else还使用了一个名为
#requests
的变量

<ng-template #requests>
  <div class="pending-requests">
    <div class="request-list" *ngFor="let request of requests">
      <span>{{ request.clientName }}</span>
    </div>
  </div>
</ng-template>


{{request.clientName}
说明：
您可以在阵列上使用*ngFor。您已将用户声明为数组。但是，Get的响应返回一个对象。您不能在对象上使用。你应该有一个数组。您可以显式地将对象强制转换为数组，这将解决问题。
数据到[数据]

解决方案

getusers() {
    this.http.get(`https://api.github.com/
search/users?q=${this.input1.value}`)
        .map(response => response.json())
        .subscribe(
        data => this.users = [data], //Cast your object to array. that will do it.
        error => console.log(error)
        )

这个荒谬的错误消息仅仅意味着有一个绑定到一个不存在的数组

<option
  *ngFor="let option of setting.options"
  [value]="option"
  >{{ option }}
</option>

如果数据存在，它是数组吗

如果数据不存在，则在后端修复它。
如果这是HTML中可观察的返回，只需添加异步管道即可

observable | async
可观察的|异步
如果你没有一个数组，但是你试图像数组一样使用你的可观察对象，即使它是一个对象流，这在本机上是不起作用的。我将在下面演示如何修复此问题

如果您试图使用源类型为BehaviorSubject的observable，请将其更改为ReplaySubject，然后在组件中按如下方式订阅：

组成部分
Html

执行此错误时，未显示也未显示任何用户，console.log为空。您应该使用
项。有关响应负载的格式，请参阅此文档。这对应于响应负载中的用户数组。。。我更新了我的回答。发生错误的原因是我有一个模板变量（例如，
），该变量的名称与我使用ngFor的数据设置的变量的名称相同。所以Angular用模板变量重写了我的变量。因为这个，我损失了一个小时谢谢这似乎是这个错误的一个相当常见的原因，它只是咬了我一口。谢谢
<option
  *ngFor="let option of setting.options"
  [value]="option"
  >{{ option }}
</option>

//was the property name correct? 
setting.properNamedOptions

observable | async
this.messages$ = this.chatService.messages$.pipe(scan((acc, val) => [...acc, val], []));

<div class="message-list" *ngFor="let item of messages$ | async">