#if文でヘルパー関数を使用するHandlerbars.js

handlebars.js を使用して、結果のjsonに応じてhtmlの2つのブロックを表示したいとします。

私の店で商品を注文したことに感謝したいとしましょう。 私はこのように私のhandlerbars.jsテンプレートを書く:

{{name}}

{{#if costIsZero}} Can't find any order {{else}} You bought {{cost}} items in our shop, thanks. {{/if}}

私はこのようにcostIsZeroの簡単なヘルパーをコーディングしています:

Handlebars.registerHelper('costIsZero', function(){
    return this.cost == 0
});

私は次のjsonデータと混合します:

var data = {
  "name":"foo",
  "cost": 9
};

{{#if costIsZero}}が「コスト」の価値が何であっても、常に正しいと思われます。 私がヘルパー自体をコメントアウトすると、costIsZeroのために何も持たないので、常にfalseを返します。

All the code above is available as a JSFiddle there http://jsfiddle.net/gsSyt/

私は間違っているの?

たぶん私はhandlebars.jsの仕組みをハイジャックしているかもしれませんが、その場合、handlebars.jsで私の機能を実装する方法は?

1

2 答え

ヘルパーは、 costIsZero のような式を評価するときには呼び出されません。

if の代替として機能するカスタムヘルパーを作成することができます:

Handlebars.registerHelper('ifCostIsZero', function(block) {
    if (this.cost == 0) {
        return block(this);
    } else {
        return block.inverse(this);
    }
});

あなたはこのように使うでしょう:

{{#ifCostIsZero}}
    Can't find any order
{{else}}
    You bought {{cost}} items in our shop, thanks.
{{/ifCostIsZero}}

また、テストがゼロになっているので、在庫 if (または if )を使用することもできます。

{{#if cost}}
    You bought {{cost}} items in our shop, thanks.
{{else}}
    Can't find any order
{{/if}}

You can play with both options at http://jsfiddle.net/gsSyt/41/

4
追加された
感謝は魅力のように働く。
追加された 著者 user2512,
ちょっとしたコメント。ブロック(これ)はもはや有効ではありません。 block.fn(this)を使用する必要があります。
追加された 著者 jalogar,

これを試して:

Handlebars.registerHelper('if', function(conditional, block) {
  if(this.cost == 0) {
    return block(this);
  } else {
    return block.inverse(this);
  }
})

http://jsfiddle.net/mZbtk/2/

0
追加された
それは動作しますが、if文をオーバーロードするのは不思議です。
追加された 著者 user2512,
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript