-
-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Closed
Preserve formatting of multi-line template literal values assigned to Angular attributes? Since 3.6#17729
Suggestion
Copy link
Labels
good first issueGood fist issue!Good fist issue!help wantedWe're a small group who can't get to every issue promptly. Weβd appreciate help fixing this issue!We're a small group who can't get to every issue promptly. Weβd appreciate help fixing this issue!lang:angularIssues affecting Angular template (not general JS/TS issues used for Angular)Issues affecting Angular template (not general JS/TS issues used for Angular)locked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.Please open a new issue and fill out the template instead of commenting.
Description
Prettier 3.6.2
Playground link
--parser angularInput:
<c [a]="`1
2`" />Output:
<c
[a]="
`1
2`
"
/>Expected output:
<c
[a]="`1
2`"
/>Why?
Prettier seems to move multi-line template literals assigned as attribute values into their own lines and indents them forward, i.e., formatting this π,
key="value"
...as π,
key="
value
"
While this works well for 1) long template literals that exceed the print width and therefore must be wrapped and 2) more "complicated" expressions with, e.g., several parts +ed together, I think Prettier should leave "simple" multi-line template literals as-is. It looks better and is more space-efficient this way.
This would also be consistent with how Prettier formats TypeScript/TSX, rewriting this π,
<c a={`1
2`} />...as π,
<c
a={`1
2`}
/>;...instead of something like π,
<c
a={
`1
2`
}
/>;Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
good first issueGood fist issue!Good fist issue!help wantedWe're a small group who can't get to every issue promptly. Weβd appreciate help fixing this issue!We're a small group who can't get to every issue promptly. Weβd appreciate help fixing this issue!lang:angularIssues affecting Angular template (not general JS/TS issues used for Angular)Issues affecting Angular template (not general JS/TS issues used for Angular)locked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.Please open a new issue and fill out the template instead of commenting.