+ Start a Discussion
Shavi DabgotraShavi Dabgotra 

Account list is not coming on using lightning-datatable!

Hi Everyone!

I want a list of account using Lightning-datatable. But it is not displaying the list of accounts.
HTML:

<template>
    <lightning-card title="t">
        <template if:true={accList}>
    <lightning-datatable
    key-field="Id"
    data={data}
    columns={columns}>
    </lightning-datatable>
    </template>
    <template if:true={error}>
        {error}
    </template>
</lightning-card>
</template>

JS:

import { LightningElement ,api, wire, track} from 'lwc';
import getAccountList from '@salesforce/apex/AccountHelper.getAccountList';
export default class Test extends LightningElement {
    @track columns = [{
            label: 'Account name',
            fieldName: 'Name',
            type: 'text',
            sortable: true
        },
        {
            label: 'Type',
            fieldName: 'Type',
            type: 'text',
            sortable: true
        },
      
    ];
 
    @track error;
    @track accList ;
    @wire(getAccountList)
    wiredAccounts({
        error,
        data
    }) {
        if (data) {
            this.accList = data;
            alert(JSON.stringify(accList));
            alert(JSON.stringify(data));
        } else if (error) {
            this.error = error;
        }
    }
}

Apex Class: 

public with sharing class AccountHelper {
    @AuraEnabled(cacheable=true)
    public static List<Account> getAccountList() {
        return [SELECT Id, Name, Type, Rating,
                Phone, Website, AnnualRevenue
            FROM Account LIMIT 10];
    }
}

xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>50.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        
            <target>lightning__AppPage</target>
            <target>lightning__RecordPage</target>
            <target>lightning__HomePage</target>
        
    </targets>
</LightningComponentBundle>

Output: 

User-added image

I want the list of accounts.

Thank you in Advance!

Best Answer chosen by Shavi Dabgotra
CharuDuttCharuDutt
Hii Shavi Dabgotra
Just Copy Paste The Following Code
<template>
    <lightning-card title='Data-Table'>
       
    <div style="height: 300px;">
        <lightning-datatable
                key-field="id"
                data={data}
                columns={columns}>
        </lightning-datatable>
        <div>{error}</div>
    </div>
</lightning-card>    
</template>
 ---------------------------------------------------------------
 js 
import { LightningElement,wire } from 'lwc';
import getAccountList from '@salesforce/apex/AccountHelper.getAccountList';
const columns = [{ label: 'Account name',fieldName: 'Name',type: 'text',sortable: true},
                 {label: 'Type',fieldName: 'Type',type: 'text',sortable: true}];
export default class Test extends LightningElement {
    data = [];
    columns = columns;
    wiredActivities;
    records = '';
    error;

    @wire(getAccountList,{
        }
    )
    wiredCases(value){
        this.wiredActivities = value;
        const { data, error } = value;
    
    if(data){
        let dataEditing = JSON.parse(JSON.stringify(data));
        this.records = dataEditing.length;
        this.data = dataEditing;
        
    }else if(error){
        this.error = error;
    }
    
}
}
Please Mark It As Best Answer If it Helps
Thank you
 

All Answers

CharuDuttCharuDutt
Hii Shavi Dabgotra
Just Copy Paste The Following Code
<template>
    <lightning-card title='Data-Table'>
       
    <div style="height: 300px;">
        <lightning-datatable
                key-field="id"
                data={data}
                columns={columns}>
        </lightning-datatable>
        <div>{error}</div>
    </div>
</lightning-card>    
</template>
 ---------------------------------------------------------------
 js 
import { LightningElement,wire } from 'lwc';
import getAccountList from '@salesforce/apex/AccountHelper.getAccountList';
const columns = [{ label: 'Account name',fieldName: 'Name',type: 'text',sortable: true},
                 {label: 'Type',fieldName: 'Type',type: 'text',sortable: true}];
export default class Test extends LightningElement {
    data = [];
    columns = columns;
    wiredActivities;
    records = '';
    error;

    @wire(getAccountList,{
        }
    )
    wiredCases(value){
        this.wiredActivities = value;
        const { data, error } = value;
    
    if(data){
        let dataEditing = JSON.parse(JSON.stringify(data));
        this.records = dataEditing.length;
        this.data = dataEditing;
        
    }else if(error){
        this.error = error;
    }
    
}
}
Please Mark It As Best Answer If it Helps
Thank you
 
This was selected as the best answer
pep vanpep van
PerYourHealth is an online website for making your health insurance payments. Per Your Health is a certified, safe, and secure site that offers safe payment processing methods such as credit card, debit card, and Netbanking. It covers helpful information about your insurance company. https://peryourhealth.fun