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 の追加機能を利用し始めることができます。
関連
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] GUID / UUIDの作成方法
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み】JavaScriptで文字列の出現箇所をすべて置換する方法
-
[解決済み] BlobからArrayBufferへ移行する方法
-
[解決済み] jQueryのバージョン1、バージョン2、バージョン3の違いは何ですか?[クローズド]
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] mustache.jsでif/elseを実現するにはどうしたらいいですか?
-
[解決済み] 上級者向けJavaScript。この関数はなぜ括弧でくくられるのですか?重複
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] moment.jsでミュータビリティを回避するには?
-
[解決済み] CORS: 認証モードは 'include' です。
-
[解決済み] Chromeのwebkitインスペクタで「Unsafe JavaScript attempt to access frame with URL...」というエラーが継続的に発生する。
-
[解決済み] JavaScriptで長い配列を小さい配列に分割する方法
-
[解決済み] <ng-content>が空かどうかを確認する方法は?(これまでのAngular 2+で)
-
[解決済み] 変異を伴わないオブジェクトからの値の削除