Attribute ng-model not allowed here

Question

I am trying to use the ng-model attribute on a dropdown, however WebStorm keeps telling that it is not allowed. When I run the app, it is not bound so I thinking it has do with my Angular version. I am running the latest version, and ng-model seems to work on all other elements besides select. Has something changed within the last update?

<div class="form-group">
    <label for="selectPost" class="control-label">Posts</label>
    <select ng-model="post" class="form-control" id="selectPost" >
        <option ng-repeat="post in currentUser.posts" value="{{post._id}}">
            {{post.name}}
        </option>
    </select>
</div>

Solution 1

change ng-model into data-ng-model, it is a known WebStorm bug

Solution 2

This may not be the solution to your problem, but I was getting "not allowed here" for a lot Angular attributes inexplicably.

It turned out that I had excluded the folder that included the angular.js from my project so that it didn't bother me with my normal day to day. It meant that the page worked fine when created but Webstorm wasn't able to read it as I was writing the code

Comments

[Chemist]

How did you include angular.js (or any file) in your project?

[rpadovani]

That was my problem as well. Mark node_modules/@angular as not excluded and the problem goes away

[Edric]

@rpadovani Isn't that for Angular? Commentor is requesting for AngularJS 1.x

[rpadovani]

@Edric you are totally right :) Well, then I had this problem with Angular, and I fixed as I mentioned in my first comment!

[ush189]

It also works with AngularJS. In my case I marked the bower_components/angular folder as not excluded and it finally worked again.