2

I have a custom part of code that I want to be displayed based on a custom logic

cmp:

<template if:true={myvar}>
    <!-- custom code -->
</template>

js:

@track data;

 get myvar(){
     //this is just a test
     let result = (data.first && !data.second && data.third.includes('test'));
     console.log('result', result);
     return result;
 }

The issue is that my console.log() is printing me true but I'm unable to see code placed inside my template

Do I need to set result on a @track attribute or is there something else that I'm missing?

1 Answer 1

2

I think this might help.

Boolean attributes on standard HTML Elements are set to true by adding the attribute to the element. The absence of the attribute defaults the attribute to false. Therefore, the default value of an attribute is always false. Lightning web components use the same principle for boolean properties.

4
  • 1
    So do I need to set it as @track or? Cause I don't understand which is the proper way to achieve this even after checking documentation.
    – molinet
    Nov 13, 2019 at 10:49
  • 1
    Since you are using custom logic and expecting the propery value to change, you need to @track it, if you are exposing your property to a parent component, you should use @api
    – Atlas Can
    Nov 13, 2019 at 10:52
  • 1
    Okay, thanks a lot!
    – molinet
    Nov 13, 2019 at 11:01
  • 2
    @molinet no problem, when you are not using any decorators, your property becomes private and no changes of that property will be reflected on the html template, if changed.
    – Atlas Can
    Nov 13, 2019 at 11:08

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .