-
Notifications
You must be signed in to change notification settings - Fork 49
/
example.mustache
151 lines (115 loc) · 3.3 KB
/
example.mustache
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html>
<head>
<title>
{{title}}
</title>
{{!}}
</head>
<body>
<div id="main">
<h1>Mustache Showdown</h1>
Basic mustache {{hello}}
{{ hello}}, {{hello }} and {{ hello }} are OK
<de>{{d d d}}
{{Everything will be highlighted here}}
Mustaches highlighted in
<span class="color:{{awesome_color}};font-size:1.2em">attribute value</span>
{{!-- Should not see unquoted "=", ".", or "/" as a mustacheOperator
unless inside mustacheInside or mustacheParam --}}
<a href=/index.html>
{{#repo}}
This is a mustache [enumerable] section
<li>{{ name }}</li>
{{/repo}}
Inverted sections are supported too
{{^repo}}
No repos :(
{{/repo}}
You can {{{yield}}} here
{{! <> this is a comment TODO:}}
Another {{!-- comment --}}, this one is a block comment.
HTML elements should be able to follow:
{{! comments }}
<span class="class">Hello</span>
{{!-- and block comments --}}
<span class="class">Hello</span>
{{!-- TODO: some remark
<div>
Multiline {{comments}} with
{{variables}}
</div> --}}
This is a partial {{> partial1 }}
Yet another partial {{< partial2 }}, for ctemplate
{{=<% %>=}}Sorry, customized delimiter not handled yet<%={{}}=%>
{{#each items}}
<p class="foo">Bar</p>
{{/each}}
{{#each-in item items}}
<p class="foo">Bar</p>
{{/each-in}}
{{if true "foobar"}}
{{link-to component}}
{{#if some_helper}}
And here is an example of handlebars if...
{{else if false}}
And some text that won't ever show...
{{else}}
... with optional else added. Try matchit `%` command over if/else/if.
{{/if}}
Thanks goes to {{@defunkt}}
Feedback/blames go to {{@juvenn}}
{{Frustrations}} go to /dev/null
Multiline {{comments}} with
{{variables}}
<div>
{{#mustacheBlock
param="foo"
anotherParam="bar"
}}
{{mustacheBlock
param="foo"
anotherParam="bar"
}}
{{/mustacheBlock}}
</div>
<div class={{function "bare-handlebars go here" content concat("foo" "bar")}} class="foobar">
<p class="paragraph">Lorem ipsum dolor sit amet</p>
</div>
<!-- Indentation tests -->
{{#if true}}
{{#block
param=foo
param2=bar}}
Lorem ipsum
{{block foo=bar}}
{{/block}}
{{#block}}
Lorem ipsum
{{/block}}
{{inline}}
Lorem ipsum
{{#block
foo=bar
}}
Lorem ipsum
{{/block}}
{{inline
foo=bar}}
Lorem ipsum
{{/if}}
<!-- end indentation tests -->
<AngleBracketComponent
@mustache={{@bla}}
@number=123
data-test-id="test"
class="my-class" as |test|>
Some Text
<div>{{test.someValue}}</div>
<test.component teste="asdfads"></test.component>
</AngleBraketComponent>
<HelloAngleBrackets @prop={{test}} />
<MyInput type="text" oninput={{action (mut fooBar) value="target.value"}} />
</div>
</body>
</html>