Ember Interpolation in a href tag in handlebars template

Question

I am trying to make a simple link to google maps with a dynamic address inserted into the href field. I have tried the code below plus tons of other messing around with no luck.

Answer 1

You could do something like this, see demo.

Basically you could create a Mixin for common properties and then mix it in your models. For example:

App.BaseModel = Ember.Mixin.create({
  base: 'http://maps.google.com/?q=',
  fullAddress: function(){
    return this.get('base') + this.get('address');
  }.property('address')
});

App.MyModel = DS.Model.extend(App.BaseModel, {
  name: DS.attr('string'),
  address: DS.attr('string')
});

So you could later use it in you templates like this:

{{#each model}}
<h1>{{name}}</h1>
  <div>
    <p><a {{bind-attr href='fullAddress'}}>{{address}}</a></p>
  </div>
{{/each}}

Hope it helps.