javascript - 将字符串组合到 Ember.js 中的绑定(bind)变量

Question

我需要在我的 Ember.js/Handlebars 模板中包含图像。

我正在使用 <img {{bindAttr src="short_name"}}>如果图像恰好是 short_name 的值并且位于根目录中，这将起作用。

但是，我需要像这样构建 img src:

'/images/avatars' + short_name + '_avatar.jpg'

这将如何在 ember/handlebars 中实现？

Answer 1

考虑到 short_name 没有改变，你可以这样做:

<img src="/images/avatars{{unbound short_name}}_avatar.jpg">

但是如果 short_name 变化很大，你应该像这样使用计算属性:

var SomeModel = Ember.Object.extend({
  shortName: null,
  imgSrc: function() {
    var shortName = this.get('shortName');
    return '/images/avatars' + shortName + '_avatar.jpg';
  }.property('shortName')
});

然后在您的模板上:

<img {{bindAttr src="imgSrc"}}>