如何在编译时以角度检查错误的属性名称

时间:2017-08-24 18:43:09

标签: html angular typescript visual-studio-code

我开始使用角度并构建一些练习应用程序。我的背景主要是knockout.js,到目前为止,我非常喜欢我在Angular 2/4中看到的内容。

然而,有一件事让我觉得有些奇怪。在学习的过程中,我犯了几个拼写错误或属性错误(例如忘记在ngFor中使用循环变量),但VS代码,CLI linter和angular本身都没有抛出任何错误。例如,如果我在组件的.ts文件中有一个名为myProperty的属性,并且我不小心在我的html模板中键入{{myProporty}},我就不会收到任何错误。只有一个空白区域没有输出,我可以试着弄清楚我做错了什么。在一个简单的模板中,这很容易,但至少有一次,当我试图弄清楚我错过了什么时,它会让我筋疲力尽。

如果模板在@Component装饰器标签中内联声明,我注意到linter实际上抛出错误。在这种情况下运行ng lint会给我错误The property "myProporty" that you're trying to access does not exist in the class declaration.但是,如果我的模板在自己的html文件中,则不会抛出这样的错误。

我不确定是否存在我错过的“严格”设置,或者可能这只是一个工具问题,但是对于没有任何类型的检查这种事情似乎很奇怪。对于这些东西,VS代码似乎也没有任何类型的智能感知,尽管这可能是一个VS代码问题,我不知道。

只是想知道是否有人知道可以检查这些内容的插件,或者是否有错过的CLI命令或其他内容。

1 个答案:

答案 0 :(得分:0)

也许其他人知道一个更好的解决方案,但我google了一下,似乎这个HTML验证是Angular的一个持续开发领域。

与此同时,我找到了一个有用的VS代码扩展来解决我的智能感知问题:https://github.com/angular/vscode-ng-language-service

最新版本(0.1.5)似乎已被打破,但0.1.4给了我所有html模板的智能感知,我认为这将有很大的帮助。