javascript - Angular 2: TypeError: l_thing0 is undefined in [{{thing.title}} in AppComponent@4:44] -


i'm getting strange error in app. it's supposed print out {{thing.title}} object, shows error in console:

exception: typeerror: l_thing0 undefined in [{{thing.title}} in appcomponent@4:44] 

i'm not sure l_thing0 coming from. if try show {{thing}}in page, displays [object object]. if try json.stringify(this.thing) (see showobj() function), correctly displays stringified object. if try access attribute {{thing.title}} error l_thing0 undefined.

here app.component.ts:

import {component, oninit} 'angular2/core'; import {thing} './thing'; import {thingservice} './thing.service'; import {subthingcomponent} "./subthing.component";  @component({     selector: 'thing-app',     template: `         <div class="container">             <div class="row">                 <div class="col-md-12">                     <h1>{{thing.title}} <a href="#" (click)="showobj()" class="btn btn-default">show stringified obj</a></h1>                     <subthing></subthing>                 </div>             </div>         </div>     `,     styles:[`      `],     directives: [subthingcomponent],     providers: [thingservice] })  export class appcomponent implements oninit {      constructor(private _thingservice: thingservice) { }      public thing: thing;      showobj() {         // correctly shows stringified object         alert(json.stringify(this.thing));     }      getthing() {         this._thingservice.getthing().then(thing => this.thing = thing);         // correctly logs object         settimeout(() => {console.log('thing', this.thing)}, 5000);     }      ngoninit() {         this.getthing();     } } 

any ideas?

the issue first time load page, thing still undefined, gets set real value later on asyncronously, first time tries access property, throw exception. ? elvis operator shortcut nullcheck:

{{thing?.title}}

but best idea more performant not try render component @ until have real object adding like:

<h1 *ngif="thing">

to container.


Comments

Popular posts from this blog

get url and add instance to a model with prefilled foreign key :django admin -

android - Keyboard hides my half of edit-text and button below it even in scroll view -

css - Make div keyboard-scrollable in jQuery Mobile? -