function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
le quang anhle quang anh 

how to show icon based on condition in lwc?

I have the following dashboard, which is coded in LWC. I want to show out users who have birthday on this month. But I need to emphasize the person who has birthday today by marking them with a birthday box icon. But I can only put the icon next to all of them, how can I filter to put that icon only to the person who has birthday today. Really need your help, here is my code:
 
<template>
<lightning-card title="This Month Birthday" icon-name="custom:custom11">
   <lightning-layout multiple-rows="true">
      <lightning-layout-item class="slds-p-around_xx-small frame" size="">
         <lightning-layout>
            <lightning-layout-item class="slds-p-around_xx-small" size=''>
               <div>
                  <lightning-layout class='casedt slds-wrap slds-size_7-of-7'>
                     <template for:each={data} for:item="item">
                        <lightning-layout-item  class="slds-size_1-of-7" key={item.id} >
                                <lightning-tile label='' type="media" variant="Narrow">
                                   <div class="slds-col slds-size_4-of-5 slds-align_absolute-center slds-m-around_x-medium avatar">
                                         <img src={item.AvatarUrl__c} title={item.Name_And_Birthday__c} class="avt_img">
                                         <lightning-icon icon-name="action:share_thanks" class="BirthdayCheck" size="xx-small"></lightning-icon>
                                   </div>
                                </lightning-tile>
                        </lightning-layout-item>
                     </template>
                  </lightning-layout>
               </div>
            </lightning-layout-item>
         </lightning-layout>
      </lightning-layout-item>
   </lightning-layout>
</lightning-card>
 
import { LightningElement,wire,track } from 'lwc';
   import getRecords from '@salesforce/apex/BirthdayNotiController.getRecords';

  export default class BirthdayNotification extends LightningElement {
   @track data = [];
recordId;
recordPageUrl;
wiredActivities;

@wire(getRecords)
wiredclass({error,data}){
  // this.wiredActivities = value;
  // const { data, error } = value;
  if (data) { 
    // let lstdata = JSON.parse(JSON.stringify(data));
    console.log("data:" +data);
      this.data = data;
      this.error = undefined;  
  } else if (error) {  
      this.error = error; 
      this.data = undefined;  
  }  
}
}

 
Lucille ParhamLucille Parham
Thanks for the information on this. I really enjoy the information. google (https://www.google.com/)
marcum harrisonmarcum harrison
The data structure should include a field that indicates whether or not the person is celebrating a birthday today. And based on what I see in your code, everything is organized and included. So for developers who are searching for this setup, you should try this code now because it really works. I already tried it, by the way. And for a game recommendation, I highly suggest playing honkai impact 3rd (https://www.emulatorpc.com/honkai-impact-3/) and download farmville: tropic escape (https://games.lol/farmville-tropic-escape/). Both games are free to download and easy to play.