title: Problems writing to a nested array of objects in Angular
body: <p>I have a model component that defines the data structure that I'm using.  I then use that model in another component and try to write data to it.  I'm having challenges writing to the 'nested' object array in my data structure.  I'm pretty sure it's because I haven't declared the nested array correctly (instantiated it) but can't quite figure out how to do it properly.  No question it's a limitation in my knowledge but after thrashing on it for several hours I figured I'd reach out for help.  Any guidance would be appreciated.</p>
  
  <p>Simplified stackblitz below...
  <a href="https://stackblitz.com/edit/angular-bgk5fo" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-bgk5fo</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export class Adventure {
    id ? : string;
    companylogo: string;
    guideavatar: string;
    quizavatar: string;
    active: boolean;
    treasureimage: string;
    poi: [{
      completedflag: boolean;
      firsthint: string;
      secondhint: string;
      thirdhint: string;
      quizanswer: string;
      quizfail: string;
      quizoptionone: string;
      quizoptiontwo: string;
      quizoptionthree: string;
      quizquestion: string;
      quizsuccess: string;
      sortorder: number;
      target: string;
    }];
  }
  
  import {
    Component
  } from '@angular/core';
  import {
    DataModel
  } from './data.model'
  
  @Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
    name = 'Angular';
  
    testModel = new DataModel();
  
    createArray() {
      this.testModel.firstname = 'Jack';
      this.testModel.lastname = 'Brown';
      this.testModel.pet[0].petalive = true;
      this.testModel.pet[0].petname = 'Whiskers';
      this.testModel.pet[0].pettype = 'Cat'
    }
  
  
  
  
  }</code></pre>
  </div>
  </div>
  </p>