Null Check in Value

Question

Hi

I have below code and i want if value is null in fMobileNo then in Html Hyphen should be displayed

    if (this.fatherData && this.fatherData.phoneDetails) {
      this.fMobileNo = this.fatherData.phoneDetails.find((c:any) => c.phoneType === 'MOBILE');
    }

Thanks

Amit Mohanty · Answer

Try this if (this.fatherData && this.fatherData.phoneDetails) { const mobile = this.fatherData.phoneDetails.find((c: any) => c.phoneType === 'MOBILE'); this.fMobileNo = mobile ? mobile.phoneNumber : '-'; // Assuming mobile has a property 'phoneNumber' }

Vishal Joshi · Answer

Hello Ramco Try the below code to check if null then show Hyphen if (this.fatherData && this.fatherData.phoneDetails) { this.fMobileNo = this.fatherData.phoneDetails.some((c:any) => c.phoneType === 'MOBILE') ? this.fatherData.phoneDetails.find((c:any) => c.phoneType === 'MOBILE') : '-'; } Thanks

Adarsh Nigam · Answer

You can use the Elvis operator (also known as the nullish coalescing operator) in your HTML template to achieve this. Here's an example: {{ fMobileNo ? fMobileNo : '-' }} This will display the value of fMobileNo if it's not null or undefined and a hyphen ( - ) if it is. Alternatively you can use a ternary operator: {{ fMobileNo !== null ? fMobileNo : '-' }} Both of these approaches will render a hyphen if fMobileNo is null or undefined. If you want to handle this in your TypeScript code instead you could do something like this: if (this.fatherData && this.fatherData.phoneDetails) { this.fMobileNo = this.fatherData.phoneDetails.find((c:any) => c.phoneType === 'MOBILE'); if (!this.fMobileNo) { this.fMobileNo = '-'; } }

Meet Shah · Answer

Try this. if (this.fatherData && this.fatherData.phoneDetails) { const mobile = this.fatherData.phoneDetails.find((c: any) => c.phoneType === 'MOBILE'); this.fMobileNo = mobile ? mobile.number : null; // Assuming `number` is the property holding the phone number } HTML code {{ fMobileNo || '-' }}

Gowtham Cp · Answer

Hi! To display a hyphen when fMobileNo is null  update your TypeScript like this: this.fMobileNo = this.fatherData?.phoneDetails.find((c: any) => c.phoneType === 'MOBILE') || null; And in your HTML use: {{ fMobileNo || '-' }} This will show a hyphen if fMobileNo is null . Hope that helps!

Jignesh Kumar · Answer

Hello Ramco You can make the below changes this.fMobileNo = this.fatherData?.phoneDetails?.find((c: any) => c.phoneType === 'MOBILE') ?? null; html file : {{ fMobileNo?.number ?? '-' }}