0

長く複雑なタイトルで申し訳ありませんが、うまく要約できませんでした。

fooに初期化されたプロパティを持つ単純なモデルがありますnull。

foo私の見解では、がnullまたはのときに入力フィールドを表示したくなく、Add foo""というボタンがあります。

<a href="#" class="btn" {{action addFoo obj}}> Add foo </a>

{{#if obj.foo}}
  {{view Ember.TextField valueBinding="obj.foo"}}
{{/if}}

次に、私のアクションaddFooで、次のことを行います。

obj.set('foo', 1);

入力フィールドが表示されます。

このアプローチには 2 つの問題があります。

  1. 1は実際には任意の値であり、私のアプリケーションでは特別な意味はありません。
  2. 1ユーザーが入力したいという理由で削除2すると、入力する前に入力フィールドが消えてしまい2ます。

この種のユーザー インタラクションに対するより良いアプローチはありますか?

4

2 に答える 2

0

あなたの質問を理解したかどうかわかりませんが、これが必要な場合は、これをチェックしてください。

プロパティfooは長さ 0 の配列、つまり

foo: []

ハンドルバーファイル

<a href="#" {{action addTextField obj}} class="btn">Add Foo</a>
{{#each foo}}
  {{view Ember.Textfield}}
{{/each}}

テキストフィールドの追加:

addTextField: function(){
  obj.get('foo').pushObject(1);
}

したがって、テキストフィールドの数 = 配列の長さfooテキストフィールド値のバインディングを保持する必要がある場合は、次のアプローチを使用してください:(obj.fooこれも空の配列です)

obj.textFieldView = Ember.CollectionView.extend({
  contentBinding: 'foo',
  itemViewClass: Ember.Textfield.extend({
    valueBinding: 'this.content'
  })
})

obj.addTextField = function(){
  obj.get('foo').pushObject("");
}

ハンドルバーファイル

<a href="#" {{action addTextField obj}} class="btn">Add Foo</a>
{{#collection obj.textFieldView}}
{{/collection}}

「Add Foo」をクリックするたびに、新しいテキストフィールドが追加され、テキストフィールドに入力したものはすべて「foo」配列にバインドされます....これが役立つことを願っています

于 2012-09-24T07:45:40.210 に答える
0

モデルに計算されたプロパティを追加することになりました。

fooIsSet: function() { return this.get('foo') !== null }.property('foo')

私のhandlebarsテンプレートでは、これを行うことができます：

{{#if obj.fooIsSet}}
  do stuff
{{/if}}

このようにして、プロパティが設定され有効であるかのようnullに処理することができます。''

于 2012-09-24T19:14:46.833 に答える