TypeError: Kann die Eigenschaft 'URL' von undefined nicht lesen

Question

Ich versuche, Daten aus einer REST-API mit angular2 zu holen, alles läuft bis jetzt gut; jedoch habe ich einen Fehler, der auf der Konsole zeigt nur, wenn {{content.img.url}} Aufruf führt sie fein auf der Webseite nur, wie es die Bild-URL abzurufen, die geholt werden muss, und zeigt das Bild, aber in Chromkonsole zeigt es:

EXCEPTION: TypeError: Cannot read property 'url' of undefined in [background-image: url('{{content[img].url}}'); in HomePage@63:29]

Ich habe wirklich keine Ahnung, warum es den Fehler nur in der Konsole zeigt! irgendwelche Ideen, um das zu lösen?

Im Folgenden finden Sie die Details zu dem, was ich tatsächlich mache, um die Daten mithilfe der REST-API abzurufen. Vorschläge zur Verbesserung des Codes sind willkommen!

home.html

<div *ngFor="#content of c1"> 
<div class="cards" style="background-image: url('{{content.img.url}}');"> 
<div class="txt">{{content.c1Name}}</div></div> 
</div> 

home.js

export class HomePage { 
static get parameters(){ 
return [[Http]]; 
} 

constructor(http) { 
this.http = http; 
this.c1 = null; 
//this is a bad way to do it as _defaultOptions is Protected, is there any way to do it better? 
this.http._defaultOptions.headers.append('X-Parse-Application-Id', 'appk'); 
this.http._defaultOptions.headers.append('X-Parse-REST-API-Key', 'apikey'); 

this.http.get('https://example.com/classes/table').subscribe(data => { 
    this.c1 = data.json().results; 
}); 

} 

Ausgabe des geholten JSON

0:Object 
    createdAt:"2016-01-08T13:55:53.558Z" 
    c1Name:"Jack" 
    img:Object 
    __type:"File" 
    name:"tfss-6a8bf-1db8-4545-91e6-18-file.jpg" 
    url:"http://files.parsetfss.com/f213b50e-dsdsdas-23fsrfdfd-d/file.jpg" 
    objectId:"3mfH4sd23" 
    updatedAt:"2016-01-08T17:21:00.678Z" 

Answer 1

konnte ich mit Hilfe des Elvis Operator (d) in meinem Fall das Problem lösen, habe ich:

{{content.img .url}}

hoffte, das hilft jemand!

Answer 2

Die Nachricht über content[img].url in Ihrer Nachricht erzählt, und ich kann, dass Sie sehen, Verwenden Sie content.img.url. Es ist wirklich anders. Ich meine, der zweite greift auf die img Eigenschaft des content Objekts zu. Die erste die Eigenschaft mit dem in der Variablen img angegebenen Namen.

Ich erwarte content[img] gibt Null zurück, besonders wenn img Null oder undefiniert ist. Bei content.img ist dies nicht der Fall.

Sind Sie sicher, nicht den Ausdruck content[img] zu verwenden.

Siehe diese Plunkr: http://plnkr.co/edit/IFAuvA36YXelXkUG4HfN?p=preview.