Webstorm 10 says "expected close }}" on Angularjs template code

Question

I am using WebStorm 10.0.4 with some Angularjs files and it seems to mostly work. But, WebStorm incorrectly flags some correct {{code}}. Specifically, in this example:

<div>{{thisworks}}</div>
<div>{{butnotthis | uppercase}}</div>
<div>{{oreventhis()}}</div>

The first line is OK, but WebStorm marks the second and third lines as incorrect (squiggly red line). The error message it gives is "expected close }}" for each line, as you can see:

Under Preferences->Javascript->libraries I have

• angularjs-DefinetlyTyped (from Download->Typescript Community stubs)
• HTML
• HTML5 / ECMASCRIPT 5
• Meteor project library (this is a meteor project)
• Node.js globals

Any ideas?

Answer 1

In Meteor projects, WebStorm treats .html files as spacebar templates by default, so these Angular injections are parsed as handlebars ones. Please disable 'Open html files as handlebars' in the settings 'File | Settings | Languages & Frameworks | JavaScript | Templates - does this help? Note that Angular support in Meteor projects is planned for WebStorm 11 (WEB-17118)