如何教WebStorm9检查器识别AngularMaterialDesign标签/属性？

目前,我的所有角度材质HTML属性都以黄色突出显示,并附带WebStorm 9(Mac OS X Yosemite)警告:"此处不允许使用"属性[名称]".

如何教WS自动将这些属性识别为有效？我知道我可以逐个添加每个自定义属性列表,但希望有更好的方法来做到这一点.

更新: 只是想澄清这个问题适用于Angular Material项目,而不是AngularJS本身.

您需要将angular-material.js文件添加为WebStorm中的库:

打开首选项(Mac上Cmd+,,赢/ Linux的:Ctrl+Alt+S)

去 Languages & Frameworks > Javascript > Libraries



单击Add,然后按+图标



angular-material.js在您的node_modules文件夹中查找



添加名称和版本,然后按 Ok

现在,您将对源代码中包含@ngdoc文档的所有元素和属性进行完成angular-material.

用法

开始输入,您将看到完成:

按下F1(Win/Linux上的Ctrl + Q)也会显示一些文档,如果在源代码中可用:

重要的提示

并非所有功能都已正确记录,以下内容将不会显示(除非您已经使用过它们)因为它们是在循环中动态定义的,而不是@ngdoc它们:

var API_WITH_VALUES = [ "layout", "flex", "flex-order", "flex-offset", "layout-align" ];
var API_NO_VALUES   = [ "show", "hide", "layout-padding", "layout-margin" ];

因此,对于这些,您必须将它们添加为自定义属性(Alt+Enter>"将flex添加到自定义html属性").

环境

使用WebStorm 2016.1.1在Mac OS X 10.11.4上测试过,但这也适用于旧版本.

我正在使用PHPStorm,这是一个姐妹项目WebStorm,但它应该以相同的方式工作.

您可能需要添加库:

文件

设置

语言和框架

使用Javascript

图书馆的

在这里添加AngularJS

如果这不起作用,您可以手动添加它们:

请遵循以下步骤:

文件

默认设置

编辑

检查

HTML

未知的HTML标记属性

在右侧,您将在选项"自定义HTML标记属性"中看到.在此输入您要允许的属性.

我强烈建议您安装Angular.js插件:

转到菜单文件>设置(如果您在Windows上,则选择ctrl+ alt+ S);

在窗口中选择要打开的插件;

单击Browse Repositories按钮;

在搜索字段中键入AngularJS.选择插件;

单击"安装插件".

该插件用于读取@ngdocngMaterial源中存在的注释并为其指令创建文档.

它似乎支持WebStorm和其他IDE,但在其他IDE过滤时我无法在插件注册表中找到它.也许它可以在WebStorm中运行......

无论如何,这是你得到的: