displaying js object array values in lwc

Question

Having trouble displaying true values in lwc html

This is the js:

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

import retrieveQuoteData from "@salesforce/apex/getRelatedQuotesDDSummaryLWC.retrieveQuoteData"; import { getRecord } from "lightning/uiRecordApi";

export default class dDSummary extends LightningElement { @api recordId; @track records; @track dataNotFound; @track recordObj = [];

@wire(retrieveQuoteData, { keySearch: "$recordId" })
wireRecord({ data, error }) {
    var key;
    if (data) {
        this.records = data;
        if (data !== undefined && data !== null) {
            for (key in data) {
                if (data[key].C1DDAPPEMP__c < 0) {
                    this.recordObj.push({
                        record: data[key],
                        isRedColor: true,
                        isYellowColor: false,
                        isGreenColor: false
                    });
                    console.log('Checking isRedColor C1DDAPPEMP__c -----> '+data[key].C1DDAPPEMP__c);
                } else if (data[key].C1DDAPPEMP__c >= 0 && data[key].C1DDAPPEMP__c <= 30) {
                    this.recordObj.push({
                        record: data[key],
                        isRedColor: false,
                        isYellowColor: true,
                        isGreenColor: false
                    });
                    console.log('Checking isYellowColor C1DDAPPEMP__c -----> '+data[key].C1DDAPPEMP__c);
                } else if (data[key].C1DDAPPEMP__c > 30) {
                    this.recordObj.push({
                        record: data[key],
                        isRedColor: false,
                        isYellowColor: false,
                        isGreenColor: true
                    });
                    console.log('Checking isGreenColor C1DDAPPEMP__c -----> '+data[key].C1DDAPPEMP__c);
                    console.log('Checking isGreenColor -----> '+JSON.stringify(this.recordObj));
                }
            }
        }
        this.error = undefined;
        this.dataNotFound = "";
        if (this.records === "") {
            this.dataNotFound = "No Quotes found for the Opportunity";
        }
        this.error = error;
        this.data = undefined;
    }
}

}

this is the html:

<template if:true={isGreenColor}>
                                        <td style="color:green;">
                                            <lightning-formatted-number value={quoteItem.record.C1DDAPPEMP__c}
                                                format-style="percent-fixed" currency-code={quoteItem.record.CurrencyIsoCode}
                                                minimum-fraction-digits="1">
                                            </lightning-formatted-number>
                                        </td>
                                    </template>
                                    
                                    <template if:true={isRedColor}>
                                        <td style="color:red;">
                                            <lightning-formatted-number value={quoteItem.record.C1DDAPPEMP__c}
                                                format-style="percent-fixed" currency-code={quoteItem.record.CurrencyIsoCode}
                                                minimum-fraction-digits="1">
                                            </lightning-formatted-number>
                                        </td>
                                    </template>

                                    <template if:true={isYellowColor}>
                                        <td style="color:yellow;">
                                            <lightning-formatted-number value={quoteItem.record.C1DDAPPEMP__c}
                                                format-style="percent-fixed" currency-code={quoteItem.record.CurrencyIsoCode}
                                                minimum-fraction-digits="1">
                                            </lightning-formatted-number>
                                        </td>
                                    </template>

When I do console.log('Checking isGreenColor -----> '+JSON.stringify(this.recordObj));

its logging "SBQQ__Opportunity2__c":"0069H000001GY1yQAG"},"isRedColor":false,"isYellowColor":false,"isGreenColor":true}]

tried with <template if:true={quoteItem.record.isGreenColor}> - still not displaying

Answer 1

All I had to do is this: {quoteItem.isGreenColor}