Angular 2 two way data binding with ngModel -
first off new typescript , angular 2 , seems obvious answer can't seem work. have following model
export interface ibrand { brandid: number; name: string; image: string; }
then have component class
import { component, oninit } '@angular/core'; import { router, routeparams } '@angular/router-deprecated' import { bootstrap } '@angular/platform-browser-dynamic'; import { ibrand } './brand'; import { brandservice } './brand.service'; @component({ selector: 'data-bind', templateurl: 'app/dashboardapp/brands/brand-list.component.html', styleurls: ['app/dashboardapp/brands/brand-list.component.css'] }) export class brandlistcomponent implements oninit { brands: ibrand[]; errormessage: string; newbrand: ibrand; pagetitle: string = 'brands'; constructor(private _brandservice: brandservice, private _router: router) { } ngoninit(): void { this._brandservice.getbrands() .subscribe( brands => this.brands = brands, error => this.errormessage = <any>error); } }
and have following html
<div class="form-group"> <label for="brandname">brand:</label> <input type="text" class="form-control" placeholder="name" id="brandname" [(ngmodel)]="newbrand.name" /> </div>
i can't properties of ibrand work , error
platform-browser.umd.js:962 original exception: typeerror: cannot read property 'name' of undefined
however can bind pagetitle. ideas can point me in right direction?
it's been while since have asked question, , it's starting views add answer.
first need change interface class and add constructor.
export class brand { constructor() {} brandid: number; name: string; image: string; }
now have constructor can use new operator instantiate object.
export class brandlistcomponent implements oninit { brands: brand[]; errormessage: string; newbrand: brand = new brand(); pagetitle: string = 'brands'; (...) }
now have desired brand initialized without data , can bind model. hope helps.
Comments
Post a Comment