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

Popular posts from this blog

wordpress - (T_ENDFOREACH) php error -

Export Excel workseet into txt file using vba - (text and numbers with formulas) -

Using django-mptt to get only the categories that have items -