车把模板中href标签中的Ember插值

时间:2013-07-11 12:36:06

标签: ember.js string-interpolation handlebars.js

我正在尝试使用插入href字段的动态地址创建一个简单的谷歌地图链接。我已经尝试了下面的代码加上其他大量的麻烦,没有运气。如何在把手href字段中插入动态余烬字符串?

我正在使用余烬,铁轨和把手。 我知道如何使用bindAttr,如果我将整个url存储在我的模型中,但我只有地址。如果我可以在视图中调用一次,那么将google网址与每个模型放在一起似乎是不必要的。

<h1>{{name}}</h1>
 <div>
  <p><a {{bindAttr href='http://maps.com/?1=address'}}>{{address}}</a></p>
 </div>

<h1>{{name}}</h1>
<div>
  <p><a href='http://maps.google.com/?q={{address}}'>{{address}}</a></p>
</div>

我以前用来修复它

App.Location = DS.Model.extend(
  name: DS.attr('string', defaultValue: "")
  address:  DS.attr('string', defaultValue: "")
  fullAddress: (->
    "http://maps.google.com/?q=#{@get('address')}"
  ).property('address')
)

1 个答案:

答案 0 :(得分:8)

您可以执行此类操作,请参阅demo

基本上,您可以为常用属性创建Mixin,然后将其混合到模型中。 例如:

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')
});

所以你以后可以在你的模板中使用它:

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

希望它有所帮助。