web-dev-qa-db-ja.com

Handlebars.jsヘルパー引数で文字列と変数を連結する正しい方法は？

Emberで簡単なモーダルコンポーネントを構築しようとしていますが、ハンドルバーの「ロジックレス」は私にとって論理的すぎると思われます。これをやや結果を達成するための正しい方法はありますか？

<h2>Nice block about {{title}}</h2>
<a href="#" data-toggle="modal" id="add-item-{{title}}"> {{!this works}}

{{#my-modal modal-id="add-item-{{title}}" header='New {{title}}'}} {{! those don't}}
  <p>My body blabla</p>
{{/my-modal}}

現在、モーダルIDは文字通り"add-item-{{title}}"であり、モーダルタイトルも取得しています。

そして...いいえ、今のところ、「タイトル」を新しいパラメータとして渡し、それをモーダルで使用することを検討していません。別のテンプレートのモーダルヘッダーは「新しい{{title}}」ではなく、「よろしいですか？」または「{{title}}に関する詳細」。

ember.jshandlebars.jscustom-component
25
igorsantos07

探しているのは concat helper です。それを使用すると、2番目の例は次のようになります。

{{#my-modal modal-id=(concat 'add-item-' title) header=(concat 'New ' title)}} 
  <p>My body blabla</p>
{{/my-modal}}
52
Mike Post

ここで、handlebars.jsでconcatヘルパーを探しました。同じものを探してここに着陸するのに役立つ場合、handlebars-helpersにはappendヘルパーが組み込まれています。

{{> my-modal modal-id=(append "add-item-" title) header=(append "New " title)}}

https://github.com/helpers/handlebars-helpers

1
jiminy

うん、タイトルを渡すことは私がそれを行う方法です。タイトルに何か追加する必要がある場合は、model.title、それからコントローラーに計算されたプロパティを詰めます（es6文字列補間構文）：

コントローラー

  modalHeader: function() {
    return `New ${this.get('model.title')}`;
  }.property('model.title')

template

{{#my-modal header=modalHeader}}
  <p>My body blabla</p>
{{/my-modal}}

Idについては、コンポーネントでいくつかの楽しいことを実行してオーバーライドできます。 this codepen を参照してください。とにかく、モーダルのIDを設定したいのはなぜですか？

0
Kori John Roys