CODEWITHSUNDEEP
ember.jshandlebars.js
Craig Labenz
Craig Labenz

Reputation: 2555

How to put HREFs in Ember template

I must be missing something simple because I'm not finding the answer to my question anywhere. I've done due RTFM diligence, and am now resorting to asking my question here.

In short, I want to put a simple <a> tag in an Ember template, but the extra Ember mark up to make the object dynamic is breaking the URL itself.

My template looks like this:

<script type="text/x-handlebars" data-template-name="event-nav">
    <a href="{{ obj.url }}">{{ obj.display_name }}</a>
</script>

This, of course, results in something like this sitting in the DOM itself:

<a class="event-name logo" href="/&lt;script id='metamorph-0-start' type='text/x-placeholder'&gt;&lt;/script&gt;&lt;script id='metamorph-0-end' type='text/x-placeholder'&gt;&lt;/script&gt;"><script id="metamorph-1-start" type="text/x-placeholder"></script>Object Name<script id="metamorph-1-end" type="text/x-placeholder"></script></a>

So in short, how do I make it do?

Much thanks.

Upvotes: 0

Views: 116

Answers (1)

Michael Klein
Michael Klein

Reputation: 785

You would use the 'bindAttr'-helper for this kind of use case:

 <script type="text/x-handlebars" data-template-name="event-nav">
   <a {{bindAttr href="obj.url" alt="obj.displayName"}}>{{obj.displayName}}</a>
 </script>

Upvotes: 6

Related Questions