Angular 11 - Array mapping undefined

Question

I'm using api to get the response array, I'm trying to map the "id" under the "quiz_records" array but it returns undefined. I think that my code are correct. This is my attempt.

array

"quizRemarks": [
        {
            "id": 160,
            "user_id": 1,
            "quiz_id": 18,
            "module_id": 29,
            "number_of_correct_answers": 2,
            "created_at": "2021-10-15T03:52:52.000000Z",
            "updated_at": "2021-10-15T03:52:52.000000Z",
            "time_started": null,
            "time_finished": null,
            "remarks": 1,
            "quiz_records": [
                {
                    "id": 27,
                    "user_scores_id": 160,
                    "question_id": 2,
                    "user_answers": "DriverPH",
                    "remarks_correct_incorrect": "1",
                    "created_at": null,
                    "updated_at": null,
                    "question_text": "What is the name of this application?"
                },
                {
                    "id": 28,
                    "user_scores_id": 160,
                    "question_id": 2,
                    "user_answers": "Red",
                    "remarks_correct_incorrect": "1",
                    "created_at": null,
                    "updated_at": null,
                    "question_text": "What traffic light color tells you to stop before the intersection?"
                }
            ]
        }
    ]

ts

this.quiz_records = res['quizRemarks'].map(res => res['quiz_records'].id);
console.log(this.quiz_records);

quiz_records in the JSON is an array. You cannot direct access id with res['quiz_records'].id. — Yong Shun
– Yong Shun, Commented Oct 19, 2021 at 4:05

Rohit Maurya · Accepted Answer · 2021-10-19 05:00:48Z

1

quizRemarks is an array of objects containing an array of quiz_records. Try this to get a flat list of ids of quiz_records:

this.quiz_records = [];
this.quizRemarks.forEach(remark => {
  this.quiz_records.push(...remark.quiz_records.map(rec => rec.id));
});

answered Oct 19, 2021 at 5:00

Rohit Maurya

673 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Akhil A · Accepted Answer · 2021-10-19 05:12:53Z

1

Below code will work----

this.quiz_records = res['quizRemarks'].map(res => res['quiz_records'].map(r => r.id));

answered Oct 19, 2021 at 5:12

Akhil A

613 bronze badges

Comments

Артем Поликарпов · Accepted Answer · 2021-10-19 05:09:18Z

0

You're truing to get an id property from an array, what it inpossible. You can use nested map + flat() array method.

const result = res['quizRemarks'].map(remarks => {
  return remarks['quiz_records'].map(record => record.id);
}).flat();

answered Oct 19, 2021 at 5:09

Артем Поликарпов

262 bronze badges

Collectives™ on Stack Overflow

Angular 11 - Array mapping undefined

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related