wake-up-neo.com

Angular: Kann kein anderes unterstützendes Objekt '[object Object]' finden

Im folgenden diesem Tutorial . Auf dem Weg, um eine Liste der Benutzer von api.github zu erhalten, bekomme ich eine Fehlermeldung: 

Kann kein anderes unterstützendes Objekt '[object Object]' finden

Ich denke, es hängt damit zusammen 

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

In meinem Code, weil vorher keine Fehler aufgetreten sind, und ich bin mir nicht sicher, ob die Daten von get request stammen. Wenn Sie auf klicken, wird keine Fehlermeldung angezeigt. Hier ist mein Code bisher

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

Ich denke, dass das Objekt, das Sie in Ihrer Antwortnutzlast erhalten haben, kein Array ist. Möglicherweise ist das Array, das Sie wiederholen möchten, in einem Attribut enthalten. Sie sollten die Struktur der empfangenen Daten überprüfen ...

Sie könnten so etwas versuchen:

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

Bearbeiten

Nach dem Dokument von Github (developer.github.com/v3/search/#search-users) lautet das Format der Antwort:

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

Die Liste der Benutzer ist also im Feld items enthalten, und Sie sollten Folgendes verwenden:

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

Ich habe diesen Fehler in meinem Code erhalten, da ich JSON.parse (Ergebnis) nicht ausführen würde. 

Also war mein result ein String statt eines Arrays von Objekten.

ich bekam:

"[{},{}]" 

anstatt:

[{},{}]

import { Storage } from '@ionic/storage';
...
private static readonly SERVER = 'server';
...
getStorage(): Promise {
  return this.storage.get(LoginService.SERVER);
}
...
this.getStorage()
  .then((value) => {
     let servers: Server[] = JSON.parse(value) as Server[];
                   }
  );
5
JGFMK

Fehlende eckige Klammern um die Eingabeeigenschaft können zu diesem Fehler führen. __ Beispiel:

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

Richtig:

<app-foo [bars]="smth"></app-foo>

Falsch (auslösender Fehler):

<app-foo bars="smth"></app-foo>

1
mp31415

Etwas, das mich mehr als einmal überrascht hat, ist eine andere Variable auf der Seite mit dem gleichen Namen.

Z.B. Im folgenden Beispiel befinden sich die Daten für NgFor in der Variablen requests. Es gibt aber auch eine Variable namens #requests wird für das if-else verwendet

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