title: How to get object value when changed select option - Angular9
body: <p>How to get object value when changed select option</p>
  <pre><code>items = [
  {
    name:&quot;Same&quot;,
    age:14,
    address:&quot;Thailand&quot;
  },
  {
    name:&quot;Peter&quot;,
    age:30,
    address:&quot;Thailand&quot;
  }
  ]
  </code></pre>
  <pre><code>&lt;select class=&quot;custom-select&quot; (change)=&quot;selectItem($event.target.value)&quot;&gt;
      &lt;option *ngFor=&quot;let item of items&quot; value=&quot;{{item}}&quot; &gt;
         {{item.name}}
      &lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  <p>Can I use <code>selectItem</code> to get Object value with</p>
  <pre><code>interface Person {
      name: string;
      age: number;
      address: string;
  }
  
  public selectItem(data: Person) {
      console.log('==&gt; data:', data);
      this.name = data.name;
      this.age = data.age;
      this.address = data.address
    }
  </code></pre>
  <p>but my console.log is <code>page: [object Object]</code>
  I want it to be <code>page: {name:&quot;Same&quot; ,age:14 ,address:&quot;Thailand&quot;}</code> sometimes like that</p>