title: Angular 5 Property 'username' does not exist on type 'string[]'
body: <p>I'm trying to make a simple edit component. From a Javascript view, I can't see anything wrong, but I think I'm not working with a scope the way Angular wants, so I'm looking for some guidance. <code>ERROR in src\app\admin\customers\customer-edit\customer-edit.component.html(10,97): : Property 'username' does not exist on type 'string[]'.</code></p>
  
  <p><strong>customer-edit.component.ts</strong></p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { FormGroup} from '@angular/forms';
  import { Router } from '@angular/router';
  import { ToasterService, ToasterConfig } from 'angular2-toaster';
  import { AdminService } from '../../admin.service';
  import { customer } from '../../../../environments/environment';
  
  @Component({
      selector: 'app-admin/customer/edit-list',
      templateUrl: './customer-edit.component.html',
      styleUrls: ['./customer-edit.component.scss']
  })
  
  export class CustomerEditComponent implements OnInit {
  
      editCustomerForm: FormGroup;
      toaster: any;
      data: string[];
      toasterConfig: any;
      toasterconfig: ToasterConfig = new ToasterConfig({
          positionClass: 'toast-bottom-right',
          showCloseButton: true
      });
  
      constructor(
          private adminService: AdminService,
          private toasterService: ToasterService,
          private router: Router
      ) { }
  
      ngOnInit() {
          this.getProfile();
      }
  
      getProfile() {
          let dataCustomer = JSON.parse(localStorage.getItem('data'));
          this.data = dataCustomer as string[];
      }
  
      updateProfile(data) {
          let dataSelect = {
              id: data.id,
              email: ((document.getElementById("txt_newEmail") as HTMLInputElement).value),
              mobile: ((document.getElementById("txt_newMobileNumber") as HTMLInputElement).value),
              password: ((document.getElementById("txt_newPassowrd") as HTMLInputElement).value),
          }
          this.adminService.add&lt;any&gt;(customer.customerUpdate, dataSelect).subscribe(res =&gt; {
              this.toasterService.pop('success', 'Success', res.message);
          }, error =&gt; {
              this.toasterService.pop('error', 'Error', error.error.message);
          });
      }
  
      navigateCancle() {
          this.router.navigate(['admin/customers/list']);
      }
  }
  </code></pre>
  
  <p>My Html code is 
  <strong>customer-edit.component.html</strong></p>
  
  <pre><code>&lt;legend style="align-content:center"&gt;Edit Customer&lt;/legend&gt;
      &lt;div class="col-lg-12"&gt;
           &lt;form class="text-center border border-light p-5"&gt;
                  &lt;div class="row col-md-12"&gt;
                              &lt;label class="col-md-4" style="text-align:right;font-size:20px"&gt;Username&lt;/label&gt;
                              &lt;label class="col-md-6 mb-4" style="text-align:left;font-size:20px"&gt;{{data.username}}&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="row col-md-12"&gt;
                              &lt;button class="btn btn-info col-md-4" type="submit" (click)="updateProfile(data)"&gt;Update&lt;/button&gt;
                              &lt;div class="col-1"&gt;&lt;/div&gt;
                              &lt;button class="btn btn-danger col-md-4" type="submit" (click)="navigateCancle()" &gt;Cancle&lt;/button&gt;
                          &lt;/div&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;
  </code></pre>
  
  <p><strong>What is expected?</strong></p>
  
  <p>I don't know if it's because of my writing, or because of the configuration that caused me this error. I wrote the code based on the official document. I believe it can be built successfully.</p>
  
  <p><strong>What is actually happening?</strong></p>
  
  <p>When I run npm run build, The complete prompt is as follows:</p>
  
  <blockquote>
    <p>1>ERROR in
    src\app\admin\customers\customer-edit\customer-edit.component.html(10,97):
    : Property 'username' does not exist on type 'string[]'.</p>
  </blockquote>
  
  <p>Thanks.</p>