Skip to content

Commit a282985

Browse files
committed
Add blog post
1 parent b04d05b commit a282985

4 files changed

Lines changed: 155 additions & 2 deletions

File tree

changelog_unreleased/angular/18593.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
#### Add support for multiple switch cases (#18593 by @fisker)
1+
#### [HIGHLIGHT] Add support for consecutive switch cases (#18593 by @fisker)
22

33
This feature added in Angular v21.1.
44

changelog_unreleased/angular/18596.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
#### Support spread element in array and object literals (#18596, #18636 by @prettier)
1+
#### [HIGHLIGHT] Support support for spread elements (#18596, #18636 by @prettier)
2+
3+
This feature added in Angular v21.1.
24

35
<!-- prettier-ignore -->
46
```html
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
authors: "fisker"
3+
title: "Prettier 3.8: Angular 21.1 support"
4+
---
5+
6+
This release adds support for Angular 21.1 features.
7+
8+
Highlights include support for consecutive switch cases in Angular templates, spread elements in Angular array literals, object literals, and function calls.
9+
10+
We also added support for the ability to format Angular syntax in Markdown code blocks.
11+
12+
If you appreciate Prettier and would like to support our work, please consider sponsoring us directly via [OpenCollective](https://opencollective.com/prettier) or by sponsoring the projects we depend on. Thank you for your continued support!

website/blog/2026-01-14-3.8.0.md

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
---
2+
authors: "fisker"
3+
title: "Prettier 3.8: Angular 21.1 support"
4+
---
5+
6+
This release adds support for Angular 21.1 features.
7+
8+
Highlights include support for consecutive switch cases in Angular templates, spread elements in Angular array literals, object literals, and function calls.
9+
10+
We also added support for the ability to format Angular syntax in Markdown code blocks.
11+
12+
If you appreciate Prettier and would like to support our work, please consider sponsoring us directly via [our OpenCollective](https://opencollective.com/prettier) or by sponsoring the projects we depend on. Thank you for your continued support!
13+
14+
<!-- truncate -->
15+
16+
## Highlights
17+
18+
### Angular
19+
20+
#### Add support for consecutive switch cases ([#18593](https://github.com/prettier/prettier/pull/18593) by [@fisker](https://github.com/fisker)) {#change-18593}
21+
22+
This feature added in Angular v21.1.
23+
24+
<!-- prettier-ignore -->
25+
```html
26+
<!-- Input -->
27+
@switch (foo) {
28+
@case (0)
29+
@case (1) {
30+
<div>case 0 or 1</div>
31+
}
32+
}
33+
34+
<!-- Prettier 3.7 -->
35+
SyntaxError: Incomplete block "case". If you meant to write the @ character, you should use the "&#64;" HTML entity instead. (2:3)
36+
37+
<!-- Prettier 3.8 -->
38+
@switch (a) {
39+
@case (0)
40+
@case (1) {
41+
<div>case 0 or 1</div>
42+
}
43+
}
44+
```
45+
46+
#### Support support for spread elements ([#18596](https://github.com/prettier/prettier/pull/18596), [#18636](https://github.com/prettier/prettier/pull/18636) by [@prettier](https://github.com/prettier)) {#change-18596}
47+
48+
This feature added in Angular v21.1.
49+
50+
<!-- prettier-ignore -->
51+
```html
52+
<!-- Input -->
53+
<component
54+
[a]="[ ...a]"
55+
[b]="{...bar }"
56+
[c]="call( ...baz)"
57+
/>
58+
59+
<!-- Prettier 3.7 -->
60+
<component [a]="[ ...a]" [b]="{...bar }" [c]="call( ...baz)" />
61+
62+
<!-- Prettier 3.8 -->
63+
<component [a]="[...a]" [b]="{ ...bar }" [c]="call(...baz)" />
64+
```
65+
66+
## Other Changes
67+
68+
### Angular
69+
70+
#### Don't print attribute values that are single template or string literals on new lines ([#18378](https://github.com/prettier/prettier/pull/18378) by [@ravindUwU](https://github.com/ravindUwU)) {#change-18378}
71+
72+
<!-- prettier-ignore -->
73+
```html
74+
<!-- Input -->
75+
<component
76+
[property]="`
77+
template
78+
literal
79+
`"
80+
/>
81+
82+
<!-- Prettier 3.7 -->
83+
<component
84+
[property]="
85+
`
86+
template
87+
literal
88+
`
89+
"
90+
/>
91+
92+
<!-- Prettier 3.8 -->
93+
<component
94+
[property]="`
95+
template
96+
literal
97+
`"
98+
/>
99+
```
100+
101+
### Markdown
102+
103+
#### Support formatting Angular syntax in code block ([#18519](https://github.com/prettier/prettier/pull/18519) by [@fisker](https://github.com/fisker)) {#change-18519}
104+
105+
<!-- prettier-ignore -->
106+
````md
107+
<!-- Input -->
108+
```angular-ts
109+
@Component({
110+
selector: 'app-root',
111+
template: `<div
112+
>Welcome to {{
113+
Angular}}! </div>`,
114+
})
115+
export class App {}
116+
```
117+
118+
```angular-html
119+
<div
120+
>Welcome to {{
121+
Angular}}! </div>
122+
```
123+
124+
<!-- Prettier 3.7 -->
125+
Same as input
126+
127+
<!-- Prettier 3.8 -->
128+
```angular-ts
129+
@Component({
130+
selector: "app-root",
131+
template: `<div>Welcome to {{ Angular }}!</div>`,
132+
})
133+
export class App {}
134+
```
135+
136+
```angular-html
137+
<div>Welcome to {{ Angular }}!</div>
138+
```
139+
````

0 commit comments

Comments
 (0)