首页 > 解决方案 > VS Code - 如何从 Angular html 模板创建方法?

问题描述

因此,当我想在 Angular 组件的 html 中声明一个新方法时,webstorm 为我提供了在 ts 中创建此方法的机会: 示例网络风暴

但是,如果我在 VS 代码上尝试相同,我将无法创建方法。有什么解决办法吗?(扩展,也许在设置中) 示例 vscode

标签: angularvisual-studio-codewebstormshortcut

解决方案


您可以使用扩展程序My Code Actions v0.6.0。

将此添加到您的settings.json

"my-code-actions.actions": {
    "[html]": {
      "Create function {{atCursor:$1}}": {
        "file": "${fileBasenameNoExtension}.ts",
        "atCursor": "\\(click\\)=\"([^\"]+)\\(\\)\"",
        "text": "function {{atCursor:$1}}() {\n}\n\n"
      }
    }
  }

如果需要,您可以添加更复杂(多个)的编辑

您可以查看扩展的文档页面以查看添加/修改导入语句的复杂编辑示例。

如果角度模板文件不是 html,则调整语言 ID


推荐阅读