计算依赖输入值

Calculating dependent input values

我的目标是计算基价和售价之间的百分比利润率。但我也希望能够在保证金发生变化时重新计算价格。我不能只通过 property() 观察变化,因为价格和保证金会无限地相互重新计算。相反,我想对 keyupchange 事件运行计算,这正是我在 JQuery 中实现相同任务的方式。 但是 Ember 似乎不支持 input 助手的此类事件。只有 keypress 支持,我无法使用 keypress 实现所需的行为。

模板:

{{input value=basePrice placeholder='Base Price' action="updateMarginPercent" on="key-press"}}
{{input value=price placeholder='Price' action="updateMarginPercent" on="key-press"}}
{{input value=marginPercent placeholder='Margin Percent' action="updatePrice" on="key-press"}}

控制器:

App.ApplicationController = Ember.Controller.extend({
  basePrice: 100,
  price: 100,
  marginPercent: 0,
  actions: {
    updateMarginPercent: function() {
      debugger;
      this.set('marginPercent', (this.get('price') - this.get('basePrice')) * 100.0 / this.get('basePrice'));
    },
    updatePrice: function() {
      this.set('price', this.get('basePrice') * (this.get('marginPercent') + 100) / 100);
    }
  }
});

JSBin: http://jsbin.com/yevar/1/edit?html,js,output

扩展文本字段组件以支持 key-up

相当容易
App.KeyUpInputComponent = Em.TextField.extend({
  keyUp: function(event){
    // I chose to send these things, you could just send nothing
    this.sendAction('key-up', event, this.get('value'));
  }
});


{{key-up-input value=asdf key-up='keyUpAction'}}

http://emberjs.jsbin.com/didisuneka/1/edit?html,js,output

你的jsbin

http://jsbin.com/xedaxageze/1/edit

errrr,我意识到我之前已经回答过这个问题,这就是生活... KeyPress event not working as expected in Ember