javascript - Ember : set value of property on text field

Question

我有两个输入，一个用于英里数，另一个用于公里数。我在每个输入中使用 keyup 事件来触发另一个输入中的计算。因此，如果我在公里输入中输入 5，则英里输入的值将自动更新为 3.1068。

里程输入绑定(bind)到模型上的 miles 属性，但里程字段的编程更新不会触发绑定(bind)属性更新。我怎样才能做到这一点？

(另外:我只对用于计算和显示目的的公里输入值感兴趣。它不需要是一个属性。)

以下是输入 View :

App.MilesInput = Ember.TextField.extend({
    elementId: 'miles-input',
    focusIn: function() {
        this.set('value', '');
    },
    keyUp: function() {
        var miles = $('#miles-input').val();

        $('#kilometers-input').val(miles * 1.609344);
    }
});

App.KilometersInput = Ember.TextField.extend({
    elementId: 'kilometers-input',
    focusIn: function() {
        this.set('value', '');
    },
    keyUp: function() {
        var kilometers = $('#kilometers-input').val();

        $('#miles-input').val(kilometers * 0.621371192);
    }
});

及其相应的模板元素:

<div>
    {{view App.MilesInput value=miles type="number"}}
    <label>Mi</label>

    {{view App.KilometersInput type="number"}}
    <label>K</label>
</div>

谢谢!

Answer 1

使用计算属性并为以下对象分配相同的计算属性

 App.IndexController = Ember.Controller.extend({
   miles:'',
   kilometers: function(){
    return this.get('miles') *0.621371192;
  }.property('miles')
 });

在您的模板中

   {{input value=miles}}
   {{input value=kilometers}}

据我所知，您不需要为此使用自定义 viewElement。

我建议你读一下这篇文章 http://emberjs.com/guides/object-model/computed-properties/

这是一个 JSBin http://emberjs.jsbin.com/kitus/1/

告诉我这是否适合你