10

入力要素の周りにラベルをラップできないシナリオがあるため、次のようにする必要があります。

<label>Name</label>
{{input value=name}}

レンダリングされた出力が次のようになるように、ラベルの for 属性を入力要素の ID と一致するように設定したいと思います。

<label for="ember351">Name</label>
<input type="text" value="" id="ember351" />

要素 ID への参照を取得するにはどうすればよいですか? Ember.TextField ビューを使用するソリューションをいくつか見てきましたが、入力ヘルパー (つまり {{input}}) をサポートするソリューションを探しています。

4

3 に答える 3

4

入力ヘルパーを使用して id を設定することもできます。そう

<label for="name">Name</label>
{{input value=name id="name"}}

結果として

<label for="name">Name</label>
<input type="text" value="" id="name">
于 2014-10-26T13:06:40.440 に答える
4

これらの答えを具体化するために、HTMLBars ヘルパーを使用するより柔軟な方法があります。

<div class="form-group">
  <label for="{{guid-for this "name"}}">Your name:</label>
  {{input id=(guid-for this "name")
          type="text"
          value=value
          placeholder="Enter your name…"}}
</div>

HTMLBars ヘルパーは次のapp/helpers/guid-for.jsようになります。

import Ember from 'ember';

export default Ember.Helper.helper(function([obj, suffix]) {
  Ember.assert('Must pass a valid object', obj);
  return [Ember.guidFor(obj), suffix].join('-');
});
于 2016-01-07T20:29:44.520 に答える