1. ホーム
  2. javascript

MustacheテンプレートでIF STATEMENTを処理する方法とは?

2023-10-21 08:09:45

質問

mustacheを使っています。私はnotificationのリストを生成しています。通知JSONオブジェクトは次のようになります。

[{"id":1364,"read":true,"author_id":30,"author_name":"Mr A","author_photo":"image.jpg","story":"wants to connect","notified_type":"Friendship","action":"create"}]

mustache では、どのように if 文または case 文を notified_type &を使用します。 action ...

もし notified_type == "Friendship" をレンダリングしてください ....

もし notified_type == "Other && action == "invite" をレンダリングしてください....

どのように動作するのですか?

どのように解決するのですか?

ヒゲのテンプレートは、設計上、非常にシンプルです。 ホームページ とさえ書かれています。

ロジックのないテンプレート。

つまり、一般的なアプローチは、JavaScriptでロジックを行い、フラグの束を設定することです。

if(notified_type == "Friendship")
    data.type_friendship = true;
else if(notified_type == "Other" && action == "invite")
    data.type_other_invite = true;
//...

と入力し、テンプレートに

{{#type_friendship}}
    friendship...
{{/type_friendship}}
{{#type_other_invite}}
    invite...
{{/type_other_invite}}

より高度な機能が欲しいが、Mustache のシンプルさを維持したい場合、次のようなものがあります。 ハンドルバー :

Handlebarsは、セマンティックテンプレートを効果的に構築するために必要なパワーを提供します。

Mustache テンプレートは Handlebars と互換性があるので、Mustache テンプレートを Handlebars にインポートして、Handlebars の追加機能を利用し始めることができます。