实时模板变量

当您展开实时模板缩写时，其变量要么显示为可输入值的输入字段，要么被值替换。这些值可能是您可以修改的默认值，或者是使用函数计算得出的值。

要在模板中声明变量，请使用以下格式： $VAR$ 。

在表达式中，请使用不带开头和结尾的美元字符的变量名 $ ，例如 lowercaseAndDash(ComponentName)。

通过表达式定义每个变量，并在表达式求值失败时提供默认值。

此表达式可能包含以下结构：

双引号中的字符串常量
实时模板中定义的其他变量名称
预定义函数及其可能的参数

配置模板变量

在设置对话框（Ctrl+Alt+S ）中，转到编辑器 | 实时模板。
选择您想要配置变量的模板。
在模板文本中指定变量，然后点击编辑变量(E)…。
在编辑模板变量对话框中，您可以对每个变量执行以下操作：
- 更改变量名。
- 使用预定义函数定义表达式。
- 指定表达式评估失败时的默认值。默认值应包含在双引号中。
- 指定在表达式成功评估后，您是否希望在提示用户输入时跳过该变量。

预定义模板变量

WebStorm 支持以下无法修改的预定义实时模板变量：

$END$ 表示代码段完成时文本光标的位置，您不能再按 Tab 跳到下一个变量。
$SELECTION$ 用于环绕模板，表示要包装的代码片段。模板展开后，会按照模板中的指定方式包装所选文本。例如，如果您在代码中选择 EXAMPLE 并通过指定的缩写或按下 Ctrl+Alt+T 并从列表中选择所需的模板来调用 "$SELECTION$" 模板，WebStorm 将如下所示将所选内容用双引号括起来： "EXAMPLE"。

用于实时模板变量的函数

以下函数可用于定义实时模板变量：

函数	描述
`blockCommentEnd()`	返回指示当前语言上下文中块注释结束的字符。
`blockCommentStart()`	返回指示当前语言上下文中块注释起始的字符。
`camelCase(<String>)`	将字符串转换为 camelCase。例如， `camelCase("my-text-file")`、 `camelCase("my text file")` 和 `camelCase("my_text_file")` 均返回 `myTextFile`。
`capitalize(<String>)`	将字符串的首字母大写。例如， `capitalize("name")` 返回 `Name`。或者，您可以将其组合为 `capitalize(camelCase("my awesome class"))` ，得到 `MyAwesomeClass`。
`capitalizeAndUnderscore(<String>)`	将字符串的所有字母大写，并在各部分之间插入下划线。例如， `capitalizeAndUnderscore("FooBar")`、 `capitalizeAndUnderscore("foo bar")` 和 `capitalizeAndUnderscore("foo-bar")` 均返回 `FOO_BAR`。
`clipboard()`	返回系统剪贴板的内容。
`commentEnd()`	返回指示当前语言上下文中注释结束的字符。对于带有行注释的语言，返回值为空。
`commentStart()`	返回指示当前语言上下文中注释起始的字符。对于具有行注释的语言，返回值为行注释的起始，与 lineCommentStart() 相同。
`complete()`	在变量的位置调用代码补全。
`concat(<String>, ...)`	返回传递给函数的所有字符串参数的连接结果。例如， `concat(date()," ",user())` 返回当前系统日期和用户名，中间用空格分隔。
`dartIterableVariable()`	返回一个可以迭代的变量的名称。
`dartListVariable()`	返回数组的元素列表。
`dartSuggestIndexName()`	从最常用的名称中返回一个索引变量的建议名称： `i`、 `j`、 `k` 等。尚未在当前作用域中使用的名称将首先显示。
`dartSuggestVariableName()`	根据变量类型和初始化表达式，返回一个变量的建议名称，遵循您的代码样式设置中与变量命名规则相关的设置。例如，如果它是一个在迭代中包含元素的变量，WebStorm 会根据迭代的容器名称猜测最合理的名称。
`date([format])`	返回当前系统日期。默认情况下，无参数时，返回当前系统格式的日期。要使用其他格式，请按照 SimpleDateFormat 规范提供参数。例如， `date("Y-MM-d, E, H:m")` 返回的日期格式为 `2020-02-27, Thu, 16:11`。
`dbColumns()`	返回某个表或视图的列列表。上下文代码模板中使用了 `dbColumns()` （例如， `ins`）。您可以通过右键点击对象并选择 SQL 脚本来访问上下文实时模板。
`dbObjectName()`	返回表或视图的名称。上下文代码模板中使用了 `dbObjectName()` （例如， `top`）。您可以通过右键点击对象并选择 SQL 脚本来访问上下文实时模板。
`decapitalize(<String>)`	将字符串的首字母替换为相应的小写字母。例如， `decapitalize("Name")` 返回 `name`。
`defaultReturnValues`	如果表达式用于返回语句，则返回默认值。如果表达式是错误类型，则使用 `errorVariableName` 参数。
`enum(<String>, ...)`	在模板展开时，返回用于补全的字符串建议列表。例如， `enum("Foo","Bar","Baz")` 会显示一个列表，您可以从中选择指定的字符串之一。
`escapeString(<String>)`	转义特殊字符，使结果可用于 Java 字符串。例如，它会将制表符替换为 `\t` ，将换行符替换为 `\n` ，将反斜杠转义为 `\\` ，将引号转义为 `\"` ，等等。
`expectedType()`	返回模板展开位置处表达式的预期类型（在赋值的右侧、 `return` 之后、作为方法参数等）。仅在 Java 环境中可用。
`fileName()`	返回当前文件的名称（包含扩展名）。
`fileNameWithoutExtension()`	返回当前文件的名称（不含扩展名）。
`filePath()`	返回当前文件的绝对路径。
`fileRelativePath()`	返回当前文件相对于当前项目的路径。要检查某个文件的相对路径，右键点击该文件并选择复制引用，或按 `Ctrl+Alt+Shift+C`。
`firstWord(<String>)`	返回作为参数传递的字符串的第一个单词。例如， `firstWord("one two three")` 返回 `one`。
`groovyScript(<String>, [arg, ...])`	执行作为字符串传入的 Groovy 脚本。第一个参数是一个字符串，其中包含脚本文本或包含该脚本的文件路径。该函数将其他可选参数传递给脚本，作为 `_1`、 `_2`、 `_3`、...、 `_n` 变量的值。此外，您可以使用 `_editor` 变量从脚本内部访问当前编辑器。以下示例显示了一个 `groovyScript()` 函数，用于将给定字符串（另一个变量 $MyVar$ 的值）转换为大写字母： groovyScript("_1.toUpperCase()", MyVar) 以下示例展示了一个 `groovyScript()` 函数，该函数将所选文本拆分为单词，并将其显示为编号列表： groovyScript("def result = ''; _1.split().eachWithIndex { item, index -> result = result + index.next() + '. ' + item + System.lineSeparator() }; return result;", SELECTION) 最后一个示例使用了 `SELECTION` 预定义变量，这意味着您需要选择文本并按 `Ctrl+Alt+T` （包围方式）来应用它。
`JsArrayVariable()`	返回当前 JavaScript 数组的名称。
`jsClassName()`	返回当前 JavaScript 类的名称。
`jsComponentTypeOf()`	返回当前 JavaScript 组件的类型。
`jsDefineParameter`	基于模块的名称，从 `define(["module"], function (<parameter_in_question>>) {})` 返回参数。
`jsMethodName()`	返回当前 JavaScript 方法的名称。
`jsQualifiedClassName()`	返回当前 JavaScript 类的完整名称。
`jsSuggestDefaultVariableKind(Boolean)`	布尔参数决定在当前上下文中是否允许常量。如果未指定参数，则允许常量。当模板展开时，会显示一个列表，其中包含 TypeScript 和 ES6 的 `var`、 `let`、 `const` 选项，以及早期 JavaScript 版本的唯一 `var` 选项。
`jsSuggestImportedEntityName()`	根据文件名，建议 `import * as $ITEM$ from "$MODULE$"` 或 `import $ITEM$ from "$MODULE$"` 类型的导入语句名称。
`jsSuggestIndexName()`	从最常用的名称中返回一个索引变量的建议名称： `i`、 `j`、 `k` 等。尚未在当前作用域中使用的名称将首先显示。
`jsSuggestVariableName()`	根据变量类型和初始化表达式，返回一个变量的建议名称，遵循您的代码样式设置中与变量命名规则相关的设置。例如，如果它是一个在迭代中包含元素的变量，WebStorm 会根据迭代的容器名称猜测最合理的名称。
`lineCommentStart()`	返回指示当前语言上下文中行注释起始的字符。
`lineNumber()`	返回当前行号。
`lowercaseAndDash(<String>)`	将字符串转换为小写并插入短横线作为分隔符。例如， `lowercaseAndDash("MyExampleName")` 和 `lowercaseAndDash("my example name")` 都返回 `my-example-name`。
`regularExpression(<String>, <Pattern>, <Replacement>)`	在 `String` 中查找所有 `Pattern` 的出现并将其替换为 `Replacement`。您可以将模式指定为正则表达式，以查找字符串中与之匹配的所有内容。例如， `regularExpression(NAME, "a", "b")` 表达式会将 $NAME$ 模板变量中的任意字母 "a" 替换为字母 "b"。您可以在模式部分使用 regexp 字符类；例如， `regularExpression(NAME, "[a-z]", "b")` 将替换变量中的任何字母。如果希望 `\d` 或 `\w` 等模式被视为正则表达式字符类，您需要对斜杠进行转义，使得模式看起来像 `"\\d"`。
`snakeCase(<String>)`	将字符串转换为 snake_case。例如， `snakeCase("fooBar")` 和 `snakeCase("foo bar")` 都返回 `foo_bar`。
`spaceSeparated(<String>)`	返回使用空格作为分隔符的指定字符串。例如， `spaceSeparated("fooBar")` 返回 `foo Bar`， `spaceSeparated("Foo_BAR")` 返回 `Foo BAR`。
`spacesToUnderscores(<String>)`	将作为参数传入的字符串中的空格替换为下划线。例如， `spacesToUnderscores("foo bar BAZ")` 返回 `foo_bar_BAZ`。
`substringBefore(<String>, <Delimeter>)`	返回到指定分隔符为止的子字符串。这有助于移除测试文件名中的扩展名。例如，如果在名为 component-test.js 的文件中使用， `substringBefore(fileName(),".")` 将返回 `component-test`。
`time([format])`	返回当前系统时间。默认情况下，无参数时，返回当前系统格式的时间。要使用其他格式，请按照 SimpleDateFormat 规范提供参数。例如， `time("H:m z")` 返回的时间格式为 `13:10 UTC`。
`underscoresToCamelCase(<String>)`	将带有下划线的字符串（如 snake_case ）转换为 camelCase。例如， `underscoresToCamelCase(foo_bar_baz)` 和 `underscoresToCamelCase(FOO_BaR_baZ)` 都返回 `fooBarBaz`。
`underscoresToSpaces(<String>)`	将字符串中的下划线转换为空格。例如， `underscoresToSpaces(foo_bar_baz)` 返回 `foo bar baz`， `underscoresToSpaces(FOO_BaR_baZ)` 返回 `FOO BaR baZ`。
`user()`	返回当前用户的名称。

示例

让我们为 Angular 组件创建一个 ngcomp 模板，类似于默认的 a-component。模板将包含 3 个变量：

第一个变量 $ComponentName$ 将成为新组件类名称的占位符。
第二个变量 $selector$ 将成为组件选择器的名称。
第三个变量 $END$ 指定模板展开后光标最终应该位于的地方，并且 $ComponentName$ 和 $selector$ 占位符已被填充。

在编辑器中选择要用于模板的代码，按下 Ctrl+Shift+A ，并调用保存为实时模板… 操作。
输入将用于调用模板的缩写，例如 ngcomp ，并添加模板描述，例如 New Angular component。
将变量添加到模板。
1. 用 SearchComponent 替换 $ComponentName$ 。
2. 在 Component({}) 中添加 selector: '$selector$',。
3. 将 $END$ 添加到 ngOnInit(){}。
根据 Angular Style Guide ，选择器名称通常是组件名称的 dashed-case 版本，因此最好先指定组件名称。然而，选择器在代码中是排在第一位的。
为了解决这个问题，请点击编辑变量(E)… ，并使用箭头图标调整变量的顺序。现在 ComponentName 排在第一位，光标将在模板展开时首先跳转到它。
如果我们只需指定类名，并通过类名转换自动填充选择器名称，那就太好了。为此，请点击表达式字段，位于 selector 变量旁边，从列表中选择 lowercaseAndDash 函数，然后将 ComponentName 作为其参数输入。
与模板正文不同，在编辑模板变量对话框中，变量名称使用时不带开头和结尾的美元符号 $。
可选：
您可以选择如果定义则跳过，位于 selector 旁边。在这种情况下，编辑组件名称并按下 Enter 后，光标将移动到 $END$ 位置，而不是 $selector$ 。
让我们看看我们新的模板如何运行：

最后修改日期： 2025年 12月 8日