Problem with LWC that should show a list of answers for each Question

Question

I made an LWC that should show a list of question with some answers for each question under the Campaign Member, but after managing to retrieve the questions and show them in the HTML, I don't manage to bind the answers with the questions, the combobox has the right amount of answers but those are blank and have a null value, what can I do? I seriously tried everything.

Keep in mind I made 2 Custom objects for Question (Domanda__c) and Answer (Risposta__c) and 2 junction objects, one between Question and Campaign (CollegamentoDomandaCampaign__c) and one between Question and Answer (CollegamentoDomandaRisposta__c).

here's a screenshot of the issue.

here the code of the LWC:

HTML:

<template>

    <lightning-card title="test">

        <ul class="slds-m-around_medium">

                <template for:each = {mapData} for:item ="domanda">

                    <p key={domanda.key}>

                        <b style="color:cornflowerblue">{domanda.key} </b>

                        <lightning-combobox

                        name="selectedLabel"

                        label="Seleziona una risposta"

                        value={domandaValue}

                        placeholder="Select Progress"

                        options={domanda.value}

                        onchange={domandaChange}>

                </lightning-combobox>

                    </p>

                </template>

        </ul>

    </lightning-card>

</template>

JS:

import { LightningElement, api, wire, track } from 'lwc';

import { getRecord } from 'lightning/uiRecordApi';

import getCampaignId from '@salesforce/apex/QuestionAndAnswerController.getCampaignId';

/* import makeMap from '@salesforce/apex/QuestionAndAnswerController.makeMap';  */

/* import getCollDomandaRisp from '@salesforce/apex/QuestionAndAnswerController.getCollDomandaRisp';

import getRisposta from '@salesforce/apex/QuestionAndAnswerController.getRisposta'; */

import CONTACT_LINK from '@salesforce/schema/CampaignMember.ContactId';

import CAMPAIGN_LINK from '@salesforce/schema/CampaignMember.CampaignId';

  

export default class QuestionAndAnswer extends LightningElement {

 

    @api recordId;

    @track passId;

    @track result;

    @track collDR;

    @track risposte;

    @track mapData= [];

    @track mapCombo= [];

    salvaCampagna;

    salvaContatto;

    salvaDomanda;

    salvaRisposta;

    recordSave;

    domandaValue;

  

@wire(getCampaignId, {memberCampId: '$recordId'})async wireHandler({data,error}){

console.log(data);

console.log('stringa '+JSON.stringify(data));

    if (data!=undefined) {    

 

        console.log('wow '+data);

        for(let key in data){

            console.log('no2');

            if(data.hasOwnProperty(key)){

                this.mapData.push({value:data[key], key:key});

                console.log('ciao');               

            }

        }

         console.log('mapData: '+JSON.stringify(this.mapData)); 

        console.log('mapData: '+this.mapData);

    } else if (error) {

        console.log('errore');

    }

} passId;

domandaChange(event){

    this.domandaValue=event.detail.value;

    console.log(this.domandaValue);

}

}

Apex Controller:

public with sharing class QuestionAndAnswerController {

 

    public QuestionAndAnswerController() {

        

    }

    

    @AuraEnabled(cacheable=true)

    public static Map<String, List<String>> getCampaignId(Id memberCampId){

        CampaignMember campagnaId = [SELECT CampaignId FROM CampaignMember WHERE Id = :memberCampId LIMIT 1];

        Id passId = campagnaId.CampaignId;

        System.debug('1');

        List<CollegamentoDomandaCampaign__c> questionFind = [SELECT Domanda__c   FROM CollegamentoDomandaCampaign__c  WHERE Campaign__c = :passId];

        List<Id> saveId = new List<Id>();

        System.debug('2');

        for(CollegamentoDomandaCampaign__c c :questionFind)

        {

            System.debug('3');

            saveId.add(c.Domanda__c);

        }

        System.debug('4');

 

        Map<String, List<String>> mapRisp = new Map<String, List<String>>();

       List<Domanda__c> domandeTrovate = [SELECT Id, ContenutoDomanda__c, Multipla__c, Type__c FROM Domanda__c WHERE Id IN :saveId];

       System.debug('result 1 '+domandeTrovate);

       List<CollegamentoDomandaRisposta__c> collDomRisp = [SELECT Risposta__c, Domanda__c, Risposta__r.ContenutoRisposta__c FROM CollegamentoDomandaRisposta__c WHERE Domanda__c IN:saveId];

        for(Domanda__c d: domandeTrovate){

            List<String> risposteFiltrate= new List<String>();

            for(CollegamentoDomandaRisposta__c collDRis: collDomRisp){

                if(collDRis.Domanda__c==d.Id){

                    risposteFiltrate.add(collDRis.Risposta__r.ContenutoRisposta__c);

 

                }

            }

           mapRisp.put(d.ContenutoDomanda__c, risposteFiltrate);

        }

 

      system.debug(mapRisp);

    

        return mapRisp;

    }

 

}

Answer 1

The options parameter must be an Array with objects having label and value.

That should look something like the following.

this.mapData = Object.entries(data).map(([question, answers]) => ({
  key: question,
  value: answers.map((answer) => ({ label: answer, value: answer })),
}));