如何让 Webstorm 在重新格式化期间保持多行字符串文字的缩进答案

【问题标题】：How to make Webstorm keep indent of multi line string literals during reformat如何让 Webstorm 在重新格式化期间保持多行字符串文字的缩进
【发布时间】：2016-02-06 12:36:37
【问题描述】：

在为 angularjs 创建指令时，我经常将模板保留为字符串文字。有时模板跨越多行，所以我将它们缩进就像我缩进 html 文件一样以提高可读性。

这是一个非常简单的例子

template: '<div>' +
              '<div>' +
                  '<input ngModel="myText" type"text">' +
              '</div>' +
              '<div>' +
                  '<button ng-click="ok()">OK</button>' +
               '</div>' +
           '</div>',

不幸的是，每当我重新格式化代码时，Webstorm 都会删除我手工制作的所有缩进，因此模板将如下所示：

template: '<div>' +
'<div>' +
'<input ngModel="myText" type"text">' +
'</div>' +
'<div>' +
'<button ng-click="ok()">OK</button>' +
'</div>' +
'</div>',

是否有某个地方的设置或其他技巧使 Webstorm 在重新格式化期间保持多行字符串文字中的相对缩进？谢谢。

【问题讨论】：

为什么不把空格放在字符串中？
您有语法错误：'</div>', +
@iso 谢谢，已修复。
@jonrshape 将缩进放在字符串中将是实现此目的的一种方法，但这会不必要地使代码膨胀（我认为缩小器不会处理此问题）。因此，恐怕这对我来说不是一个选择。
只是想知道，为什么不放在 HTML 文件中？

标签： javascript webstorm

【解决方案1】：

您可以在 Preferences | 中启用特殊的格式化程序控件 cmets编辑 |代码样式，然后在您的代码中使用它们来防止 WebStorm 重新格式化它：

// @formatter:off
    template: '<div>' +
              '<div>' +
                  '<input ngModel="myText" type"text">' +
              '</div>' +
              '<div>' +
                  '<button ng-click="ok()">OK</button>' +
               '</div>' +
           '</div>',
// @formatter:on

【讨论】：

谢谢，非常有用的答案。