1

私は ember.js の最新の pre 1.0 を使用しており、単純なフォームに非推奨のボタンを使用することを避けたいと考えていました。

機能するものがありますが、テキスト入力とそのテキストへのアクセスが必要なボタンの両方を持つビューを接続する正しい方法だとは思いません。

基本的な見方はこちら

{{#view PersonApp.AddPersonView}}
       {{view Ember.TextField valueBinding="username"}}
         {{#with this as username}}
           <input type="submit" value="add" {{action addPerson username}}/>
         {{/with}}
{{/view}}

これがビューです

PersonApp.AddPersonView = Ember.View.extend({
  username: null,                                                                                
  addPerson: function(event) {
    var username = event.context.username;
    if (username) {
      PersonApp.personController.addPerson(username);
      this.set('username', ''); //this does not currently work
    }
  }
});

私が抱えている他の唯一の問題は、通常の方法でユーザー名にアクセスできないことです。つまり、 this.get('username') ですが、さらにテキストボックスの値をクリアできません(上に表示されていますが)。

この要旨の最新バージョン (以前のバージョンの ember) を構築しようとしています https://gist.github.com/1477225

4

4 に答える 4

2

ここには 3 つの問題があります (おそらく他にもあるでしょう)。まず、username は のフィールドではなく、event.context実際にはイベント コンテキストになります。view.username第二に、で指定する必要があると思いますvalueBinding。そうしないと、コントローラーがプロパティのデフォルトのホームになります（私は信じています）。次に、初期状態に設定するには、null に設定する必要があります。3 番目に、アクションのターゲットはルーターになるため、ビューをターゲットとして指定する必要があります。

これはうまくいくはずです：

{{#view PersonApp.AddPersonView}}
   {{view Ember.TextField valueBinding="view.username"}}
     {{#with this as username}}
       <input type="submit" value="add" {{action addPerson username target="this"}}/>
     {{/with}}
{{/view}}

PersonApp.AddPersonView = Ember.View.extend({
  username:  null                                                                               
  addPerson: function(event) {
    var username = event.context;
    if (username) {
       this.get('controller').addPerson(username);
       this.set('username', null); 
    }
 }

});

また、新しい人物を作成するより良い方法は、空の人物モデルを作成し、コントローラーとビューをそれにバインドしてから、レコードを保存し、その後バインディングを null に戻すことです。

于 2012-09-05T14:07:31.740 に答える
1

Gidriusのコードを使用しても、検証を実行して、今すぐデータを渡すことができます。あなたがする必要がある唯一のことは、提出処理メソッドで検証コードを書くことです。または、とにかくクライアント側の検証について話しているので、フィールド値の変更またはぼかしでそれを行うことができます。これにより、ユーザーは自分が行っていることについてほぼ瞬時にフィードバックを得ることができます。

于 2013-02-01T16:41:42.533 に答える
0

私はまだ this.get('username') のようなものを動作させることができませんでしたが、最終的には次のようになりました

{{#view PersonApp.AddPersonForm}}
       {{view Ember.TextField valueBinding="username"}}
       <input type="submit" value="add" {{action addPerson this}}/>
{{/view}}

PersonApp.AddPersonForm = Ember.View.extend({
  addPerson: function(event) {
    var username = event.context.username;
    if (username) {
      PersonApp.personController.addPerson(username);
      event.context.set('username', '');
    }
  }    
});
于 2012-09-06T01:22:06.303 に答える
0

おそらく少し遅すぎますが、他の誰かに役立つかもしれません。

通常、フォーム フィールドの値はコントローラーまたはモデルにバインドされるため、必要なのはコントローラー内の送信関数だけであり、関数が呼び出されるたびにバインディングを介してフィールドにアクセスできます。

最新のpre.4 emberを使用していると仮定すると、すべてがどのように見えるかを次に示します

更新しました

// DOM part
<form {{action submitForm on="submit"}}>
    {{view Ember.TextField valueBinding="username"}}
    <button type="submit">add</button>
</form>

そしてこちらがコントローラー

PersonApp.PersonController = Ember.ArrayController({
  username: '',
  submitForm: function() {
    var u = this.get('username'); // saving value to variable
    this.set('username',''); // sets username to ''
    console.log(u); // will output saved username
  }
});
于 2013-02-01T13:51:09.233 に答える