title: Typescript/Angular - undefined property- how to access variable in array
body: <p>I learned from debugging that q is undefined in the next() function. How can I get access to "id" in my array in order to push the value from a component(single.Value) to local storage? Thanks so much for any help you can offer!</p>
  
  <pre><code> &lt;ion-navbar color="primary"&gt;
      &lt;ion-title&gt;Quiz&lt;/ion-title&gt;
      &lt;ion-buttons start&gt;
        &lt;button ion-button icon-left (click)="prev()"&gt;&lt;ion-icon name="arrow-back"&gt;&lt;/ion-icon&gt; Prev&lt;/button&gt;
      &lt;/ion-buttons&gt;
      &lt;ion-buttons end&gt;
        &lt;button ion-button icon-right (click)="next(q)"&gt;Next&lt;ion-icon name="arrow-forward"&gt;&lt;/ion-icon&gt;&lt;/button&gt;
      &lt;/ion-buttons&gt;
        &lt;/ion-navbar&gt;
      &lt;/ion-header&gt;
  
      &lt;ion-content padding&gt;
      &lt;ion-slides #Quiz&gt;
        &lt;ion-slide *ngFor="let q of questions"&gt;
      {{q.question}}
      &lt;range [single]="single"&gt;&lt;/range&gt;
        &lt;progress-bar [progress]="loadProgress"&gt;&lt;/progress-bar&gt;
      &lt;/ion-slide&gt;
  &lt;/ion-slides&gt;
  &lt;/ion-content&gt;
  
  Typescript file:
  
      export class QuizPage {
      public RangeComponent;
      public ProgressBar;
  
      single = {
      Value: 2
      };
  
      questions = [
      {id: "programming", question: 'Which programming language do you     prefer?'}
  
      constructor(public navCtrl: NavController, public storage: Storage,     public rangeComponent: RangeComponent, public progressBar: ProgressBarComponent) {
      this.randomizeAnswers(this.questions);
      this.setData();
      this.getData();
      }
  
  
      randomizeAnswers(questions: any[]): any[] {
      for (let i = this.questions.length - 1; i &gt; 0; i--) {
      let j = Math.floor(Math.random() * (i + 1));
        let temp = this.questions[i];
        this.questions[i] = this.questions[j];
        this.questions[j] = temp;
      }
  
      return this.questions;
      }
  
  
      setData() {
      this.storage.set('QuestionData', this.questions);
      }
  
      getData() {
      this.storage.get('QuestionData').then((data) =&gt; {
      console.log(data);
      });
      }
  
      //slides
      @ViewChild('Quiz') Quiz: any;
  
      next(q) {
      // console.log('single.Value is next');
      console.log(this.single.Value);
      this.saveToArray(q);
      this.single.Value = 2;  //  Reset value to middle after every question
      this.Quiz.slideNext();
      this.progressBar.addProgress();
      }
  
      saveToArray(q) {
      if (q.id == "programming") {
        this.storage.set('programming', this.single.Value);
        this.storage.get('programming').then((data2) =&gt; {
          console.log("data logged.");
        })
      }
  </code></pre>