How to use ternary or conditional operator in LWC html Salesforce

This post explains how to use conditional(ternary) operators in LWC salesforce.

Template expression doesn't allow Conditional Expressions. You can not use if-else conditions directly in LWC html. There are specific tags in LWC to use conditional rendering.

• <template if:true>

• <template if:false>

ternaryOpt.cmp :

<template>

    <div style = "background-color:wheat; padding: 20px;">

        <lightning-button label="Change" onclick={Change}></lightning-button>

        <div>

        <template if:true={ConditionalCheck}>

                    Hurry!! button clicked :)

            </template>

            <template if:false={ConditionalCheck}>

                    Button is not clicked yet :(

            </template>

        </div>

    </div>

</template>

ternaryOpt.js :

import { LightningElement,track } from 'lwc';

export default class TernaryOpt extends LightningElement {

    @track ConditionalCheck = false;

    Change(){

        this.ConditionalCheck = true;

    }

}

Thanks, 
Lovesalesforceyes