CODEWITHSUNDEEP
javascripthandlebars.js
GThree
GThree

Reputation: 3562

How to use regex in HandleBars.js?

This is the first time I am working on script type="text/x-handlebars". I have an object {{this.pin}} which returns me the URL (https://maps.google.com/mapfiles/markerA.png). What I want to do is grab that URL and get specific text.

Code:

<script type="text/x-handlebars" id="MapDeliveryAddressTemplate">    
    <div class="map-delivery-addresses-pin" tabindex="0"><img src={{this.pin}} aria_label={{this.pin}}/></div>
</script>

Here, {{this.pin}} returns https://maps.google.com/mapfiles/markerA.png.

What I want is:

  1. Get only A from markerA
  2. use that A to aria_label.

Desired result should be like this: 

<div class="map-delivery-addresses-pin" tabindex="0"><img src={{this.pin}} aria_label="A"/></div>

How can I do this?

Upvotes: 1

Views: 2105

Answers (1)

Chase
Chase

Reputation: 3105

You will have to create your own helper in Handlebars to achieve this. Set up a function, let's call it parseMarker, to return your value. Your new template would look like this:

<script type="text/x-handlebars" id="MapDeliveryAddressTemplate">
<div class="map-delivery-addresses-pin" tabindex="0"><img src={{this.pin}} aria_label={{{parseMarker this.pin}}})/></div> </script>

Calls to helpers are delimited by triple braces and the gist of your helper function would just be to return the match you want from a regex.

Upvotes: 1

Related Questions