Visual Studio 2013 AngularJS intellisense support

AngularjsVisual Studio-2013

Angularjs Problem Overview


I thought VS 2013 is supposed to have support for angularjs attribute intellisense? For some reason it's not working for me on the latest version of Microsoft Visual Studio Ultimate 2013 version 12.0.21005.1

Getting the following validation warning: Attribute 'ng-app' is not a valid attribute of element 'html'. Attribute 'ng-view' is not a valid attribute of element 'div'.

Am i missing an xsd reference somewhere?

Angularjs Solutions


Solution 1 - Angularjs

I had the same problem and I did the following and it helped.

If you are using ReSharper, you can add an extension that will give you Intellisense, and won't raise a warning.

Top Menu in VS>Resharper>Extension Manager>Search AngularJS This will add angular js intellisense.

-------EDIT-------

Using Resharper 8.2.1 Resharper Menu

enter image description here

Solution 2 - Angularjs

I know this is old, but it was still happening for me. To fix it for VS 2013, follow these instructions:

  1. Open the file C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\Packages\schemas\html\commonHTML5Types.xsd

  2. Find the area in the file that starts with this line: <xsd:attribute name="translate">. Scroll down about 7 lines to find the corresponding closing tag: </xsd:attribute>

  3. Just above the </xsd:attributeGroup> closing tag, paste the following lines of code:

Save the file and reopen VS2013. This should fix the issue.

Solution 3 - Angularjs

I installed http://vswebessentials.com/

created a file called _reference.js with content

/// <autosync enabled="true" />
/// <reference path="angular.js" />
/// <reference path="underscore.js" />

I learned about it from The Story Behind _references.js

Solution 4 - Angularjs

If you are using ReSharper, try turning off ReSharper IntelliSense for HTML.

ReSharper > Options > IntelliSense > General > Limited ReSharper IntelliSense

Notes:

  • This does not provide AngularJS intellisense in ASP.NET files
  • You need to reopen HTML files in VS after the settings have been changed
  • Current version of ReSharper is 8.2

Solution 5 - Angularjs

You could also just run this from the package manager console in VS 2013: Install-Package AngularJS.Intellisense.

Solution 6 - Angularjs

Try to tick Text Editor\HTML\General\Auto list members in options.

Solution 7 - Angularjs

I know this post is old and the question specifically refers to VS 2013, however if you're still running VS 2010 and want to apply puargs solution you can find the file at C:\Program Files (x86)\Microsoft Visual Studio 10.0\Common7\Packages\schemas\html\html_5.xsd.

You'll want to add puargs' code within the <xsd:attributeGroup name="commonHTML5coreAttributeGroup"> section.

Mads Kristensen also discusses [applying this solution to VS 2012]1 and provides a link to an updated version of 2012's commonHTML5Types.xsd in Step 2.

Also note that both puargs and Mads listings are missing an attribute on ng-view that causes an "attribute name must be followed by an equal (=) sign" warning. The complete element is: <xsd:attribute name="ng-view" vs:category="Angular" vs:standalone="true"/>.

Solution 8 - Angularjs

Visual Studio 2013 Update 4 removes the validation, however it does not include IntelliSense for AngularJS.

> Support for custom elements, polymer-elements and attributes > > We no longer validate unknown attributers for custom elements as there > will be many custom made tags in different frameworks. So there will > no longer be squiggles under the unknown elements. > > — Announcing new Web Features in Visual Studio 2013 Update 4 RC

Download Visual Studio 2013 Update 4.

Validation is only removed in the HTML editor, not the HTML (Web Forms) editor. This means that, by default, .html files will not have custom element validation, but .aspx pages will. If, like me, you don't think this makes sense, show your support by voting for custom elements in .aspx files.

Solution 9 - Angularjs

Running into the same problem. If you have ReSharper installed on VS 2013 like me, you can get the instellisense by installing the AngularJS plugin (provided by JetBrains).

Here's how to do it:

  1. VS2013 > ReSharper > Manage Extension.
  2. Search "AngularJS" using Nuget online, then click "Install".

The above should get you what you needed. In case you need image guide, here's the link - http://jeeshenlee.com/2014/07/12/how-to-get-angularjs-intellisense-support-on-resharper/

Solution 10 - Angularjs

I have not tried with vs2013, but could work. Working with vs2012. http://madskristensen.net/post/angularjs-intellisense-in-visual-studio-2012

Solution 11 - Angularjs

I just disabled resharper intellisense for HTML pages and got angular intellisense back on VS2013

Solution 12 - Angularjs

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionHenry OView Question on Stackoverflow
Solution 1 - AngularjsOmerBTWView Answer on Stackoverflow
Solution 2 - AngularjspuargsView Answer on Stackoverflow
Solution 3 - AngularjsXavier JohnView Answer on Stackoverflow
Solution 4 - AngularjsandershView Answer on Stackoverflow
Solution 5 - AngularjsSteve L.View Answer on Stackoverflow
Solution 6 - AngularjstomashibaView Answer on Stackoverflow
Solution 7 - AngularjsJohn CleggView Answer on Stackoverflow
Solution 8 - AngularjsjordanbtuckerView Answer on Stackoverflow
Solution 9 - AngularjsJeeShen LeeView Answer on Stackoverflow
Solution 10 - AngularjsB. BilginView Answer on Stackoverflow
Solution 11 - AngularjsAbel PereiraView Answer on Stackoverflow
Solution 12 - AngularjsPer GView Answer on Stackoverflow