如何使用插值来访问数组索引？

Question

I want to use interpolation to access a specific item at an index of my array, but it is giving me this error: "TypeError: Cannot set property '0' of undefined."

This occurs when the array is undefined, but I've already defined it in my constructor.

1. parsedData looks like

[
    {
      "studyID": "12345",
      "date": "Thu Jul 18 2019 16:05:58 GMT-0700",
      "sex": "f",
      "dateOfBirth": "1987-01-02",
      "minHz": "25.0",
      "maxHz": "55.0",
      "session": [ 
        {
          "incr": "33.2",
          "decr": "34.7"
        },
        {
          "incr": "34.0",
          "decr": "30.8"
        }
      ],
      "average": "31.5",
      "variance": "2.3"
    },

but has been stringified and parsed into an object.

2. I have an array called dateObjects which should store dates. For example, new Date('Thu Jul 18 2019 16:05:58 GMT-0700') would be at index 0. This occurs in the iteration.

for (var i = 0; i < this.parsedData.length; i++) {
        this.dateObjects[i] = new Date(this.parsedData[i].date);
    }

3. My HTML code:

 <div class="table" *ngFor="let data of parsedData; index as i"> 
Date: {{ this.dateObjects[i] | date:'fullDate'}}
</div>

I expect it to print out the dates from the dateObjects array, but it results in an error: TypeError: Cannot set property '0' of undefined.

Answer 1

Because you are already iterating over parsedData and storing them in array (dataObjects), I think instead of parsedData you should be iterating over dataObjects in HTML

<div class="table" *ngFor="let data of this.dataObjects; index as i"> 
Date: {{ data | date:'fullDate'}} // here data will be your each array element
</div>