Javascript 是否有一个「；“灰烬之路”；要将此代码共同化？

我想知道在余烬中是否有一些好的方法来重组这个混乱

如你所见，我有两个文本字段，代码几乎相同

我讨厌在我的页面中有相同的代码，我希望你能给我一些提示来改进我在Ember中的编程风格

var App = Ember.Application.create();

App.ApplicationView = Ember.View.extend({});

App.StationsDepController = Ember.ArrayController.create();
App.StationsArrController = Ember.ArrayController.create();
App.ResultsController = Ember.ArrayController.create();

App.DepartureTextValue = Em.Object.create({
    value: ''
});

App.ArrivalTextValue = Em.Object.create({
    value: ''
});

App.DepartureTextField = Em.TextField.extend({
    attributeBindings: ['list'],
    list: 'datalistDep',
    valueBinding: 'App.DepartureTextValue.value',
    textValue: App.DepartureTextValue,
    placeholder: 'Departure',
    arrayCtrl: App.StationsDepController,
    keyUp: function(e) {
        var that = this;
        if (this.textValue.get('value') != '') {
            $.get('/metier/services/rest/StationSI/Stations?letters=' + this.textValue.value, function(data) {
                that.arrayCtrl.set('content', data);
            });
        } else {
            this.arrayCtrl.set('content', '');
        }
    }
});

App.ArrivalTextField = Em.TextField.extend({
    attributeBindings: ['list'],
    list: 'datalistArr',
    valueBinding: 'App.ArrivalTextValue.value',
    textValue: App.ArrivalTextValue,
    placeholder: 'Arrival',
    arrayCtrl: App.StationsArrController,
    keyUp: function(e) {
        var that = this;
        if (this.textValue.get('value') != '') {
            $.get('/metier/services/rest/StationSI/Stations?letters=' + this.textValue.value, function(data) {
                that.arrayCtrl.set('content', data);
            });
        } else {
            this.arrayCtrl.set('content', '');
        }
    }
});

试试这个：

App.ArrivalTextField = App.DepartureTextField.extend({
    list: 'datalistArr',
    valueBinding: 'App.ArrivalTextValue.value',
    textValue: App.ArrivalTextValue,
    placeholder: 'Arrival',
    arrayCtrl: App.StationsArrController
});

---

基本上这不是余烬方式，这是通常的javascript对象扩展方式。

我认为创建这样的视图

App.MyOwnTextField = Em.TextField.extend({

  attributeBindings : ['list'],
  keyUp : function(e) {
    var that = this;
    if (this.textValue.get('value') != '') {
        $.get('/metier/services/rest/StationSI/Stations?letters='+ this.textValue.value, function(data) {
            that.arrayCtrl.set('content', data);
        });
    } else {
        this.arrayCtrl.set('content', '');
    }
  }
});

让你的其他观点像这样继承下来

App.DepartureTextField = App.MyOwnTextField.extend({

  list : 'datalistDep',
  valueBinding : 'App.DepartureTextValue.value',
  textValue : App.DepartureTextValue,
  placeholder : 'Departure',
  arrayCtrl : App.StationsDepController
});

---

可能有用。不过，我不太确定行

attributeBindings:['list']，

是否可以放在通用代码中。

27秒，可能比我的启动想法要好。你的想法也不错。所以OP将决定什么对他更有利。我接受了这个答案（比另一个答案短），它起作用了！那真是太好了！谢谢你们两位！OP选择了我的答案，但我认为你的答案仍然值得+1。我没有足够的声誉：）但你的答案也很棒！：）