DocSF

DocSF

Did You Know?

Advanced visual search system powered by Ajax

LWC Foreach Object Data

Codice html

<template>

    <lightning-card title="HelloForEach" icon-name="action:goal">

        <ul class="slds-m-around_medium">
            <template for:each={contacts} for:item="contact">
                <li key={contact.Id}>
                    {contact.Name}, {contact.Title}
                </li>
            </template>
        </ul>
        <c-view-source source="lwc/helloForEach" slot="footer">
            Il file css deve avere lo stesso nome del file html e js a differenza dell'estensione
        </c-view-source>

    </lightning-card>

</template>

Controller

// le prime due righe si ripetono quasi identiche per ogni componente
import { LightningElement } from 'lwc';

export default class HelloForEach extends LightningElement {
    // oggetto con i dati
    contacts = [
        {
            Id: '003171931112854375',
            Name: 'Amy Taylor',
            Title: 'VP of Engineering',
        },
        {
            Id: '003192301009134555',
            Name: 'Michael Jones',
            Title: 'VP of Sales',
        },
        {
            Id: '003848991274589432',
            Name: 'Jennifer Wu',
            Title: 'CEO',
        },
    ];
}

Related Post

Salesforce info object attraverso Workbench

Per recuperare le info degli oggetti nel data model di ...

Come dichiarare le variabili in Apex

Apex è un linguaggio di programmazione orientato agli ...

Salesforce lightning component passare una li

Procedere come segue: Passare al controller javascri...