title: getting undefined error on textbox data load (Angular 2)
body: <p>I am trying to pre-populate textbox. I am using the web api call for it and my service call is working fine but when I tried load to data on textbox I am getting following error.</p>
  
  <pre><code>customer.component.html: caused by: Cannot read 
  property 'firstName' of undefined
  Error: Error in app/customers/customer.component.html:18:31 caused by: 
  Cannot read property 'firstName' of undefined
  </code></pre>
  
  <p>After page load completed, I checked customer.firstName value on button click but there it is showing correct value. Not sure why I am getting error on initial page load. </p>
  
  <p>customer.component.html</p>
  
  <pre><code>&lt;input id="firstNameId" type="text" [(ngModel)] = customer.firstName 
    name="firstName" #firstNameVar="ngModel" /&gt;
  </code></pre>
  
  <p>CustomerComponent</p>
  
  <pre><code>export class CustomerComponent implements OnInit {
     customer: ICustomer;
     errorMessage: string;
     constructor(private _route:ActivatedRoute, 
              private customerService :CustomerService){
     }
     ngOnInit(): void {
       this._route.params.subscribe(
          pa =&gt; {
              this.getPerson();
        });
      }
     getPerson() {
      this.customerService.getCustomer()
      .subscribe(
              (cust:ICustomer) =&gt;
              {
                  this.customer = cust;
              },
          (error: any) =&gt; this.errorMessage = &lt;any&gt;error
      )
     }
   }
  </code></pre>
  
  <p>Customer Interface</p>
  
  <pre><code> export interface ICustomer {
      firstName:string,
      lastName:string,
      email:string
   }
  </code></pre>