While working I had a requirement to display a Total Seat of Venue in Kendo UI Mobile ListView. To display Venue Name and Number of Seats available, I created Kendo UI Template as following

<script type= "text/x-kendo-template" id="venueTemplate">
 <a href="\#toSomePage?vid=#= VenueID #" class="km-listview-link" data-role="listview-link">
 <h3>#= VenueName # </h3>
 <h5>Total Seats : <b> #=Capacity# </b> </h5>
 # }#
 </a>
 </script>

However on running the application I found that in some of the cases Capacity was retuning values as null.

Obviously displaying null was not a good idea. To display formatted information we can put condition in Kendo UI Template. Template can be modified with If-else statement as following

<script type= "text/x-kendo-template" id="venueTemplate">
 <a href="\#sessionsAtVenue?vid=#= VenueID #" class="km-listview-link" data-role="listview-link">

 <h3>#= VenueName # </h3>

 #if(Capacity ===null)
 {#
 <h5>Total Seats : <b> Not Available </b> </h5>

#}else{#
 <h5>Total Seats : <b> #=Capacity# </b> </h5>
 # }#
 </a>
 </script>

Now null value of capacity will get replaced by Not Available. On running output should be as following

We need to be bit cognizant for syntax. In below diagram you can see that line need to be executed as condition and keyword is enclosed in hash #.

In this way you can have if-else condition in KendoUI Template. I hope you find this post useful.