1

最初にテキストを表示するビューを作成しようとしています。ユーザーがダブルクリックすると、そのテキストが入力フィールドに置き換えられます。このようにして、ユーザーはテキストを簡単に更新できます（「contenteditable」属性を使用するなど）。

私はEmberpre4で機能するアプローチを持っていますが、EmberRC1では機能しません。RC1では、Ember.TextFieldは親ビューのvalueプロパティに初期化されません。ラベルテキストをダブルクリックすると、空の入力フィールドが作成されます。ここに2つのフィドルがあります：

  1. Pre4（動作中）：http：//jsfiddle.net/mattsonic/cq5yy/5
  2. RC1（同じコード-機能しない）：http：//jsfiddle.net/mattsonic/UUac9/15

Ember内で何が変わったのか考えてみてください。ありがとう。

コードは次のとおりです。

App.InputView = Ember.TextField.extend({
classNames: ["input-small"],
valueBinding: "parentView.value",
didInsertElement: function () {
    this.$().focus()
},
focusOut: function () {
    parent = this.get("parentView");
    parent.setLabelView();
}
});

App.LabelView = Ember.View.extend({
tagName: "span",
template: Ember.Handlebars.compile("{{view.value}}"),
valueBinding: "parentView.value",
doubleClick: function () {
    parent = this.get("parentView");
    parent.setInputView();
}
});

App.LabelEditView = Ember.ContainerView.extend({
tagName: "span",
labelView: App.LabelView.extend(),
inputView: App.InputView.extend(),
didInsertElement: function () {
    this.setLabelView();
},
setInputView: function () {
    this.set("currentView", this.get("inputView").create());
},
setLabelView: function () {
    this.set("currentView", this.get("labelView").create());
}
});
4

1 に答える 1

0

まったく気に入らない解決策を見つけました。しかし、説明どおりに問題を解決します。

focusIn: function() {
    var val = this.get("parentView.value");
    this.set("value", "");
    this.set("value", val);
},

focusIn イベント中に入力フィールドの値を正しい値に設定しても、失敗します。ただし、入力フィールドの値を別の値に設定してから元に戻すと、入力フィールドは正しい値で表示されます。

この問題を解決するためのより良い方法を知りたいです。Ember pre4 ソリューションは、これよりもはるかに洗練されています。

作業フィドル: http://jsfiddle.net/mattsonic/UUac9/19/

于 2013-03-10T18:40:55.937 に答える