在余烬中单击时更改图像

Question

我是一个新手，试图找出解决方案。
我有一个包含图像的模板。
当我单击图像时，应该更改图像。

applicaton.hbs

      {{#if feed.is_following}}
      <a href {{action "unfollow" feed}}>
      <img src = "unfollow.png" /></a>
      {{else}}
      <a href {{action "follow" feed}}>
      <img src = "follow.png" /></a>
      {{/if}}

Controller.js

actions:{
    change() {
    src:"unfollow.png"
    },

单击时如何将img标签源从follow.png为unfollow ，反之亦然？

Answer 1

使用计算的属性 。 只要提供的属性发生更改，就会对计算的属性进行评估。

applicaton.hbs

  <a href {{action "change"}}><img src="{{source}}" /></a>

Controller.js

follow: true,
source: Ember.computed('follow', function() {
   return (this.get('follow') ? 'follow' : 'unfollow') + '.png';
}),
actions: {
    change: function() {
       this.toggleProperty('follow');
    }
}