I've managed to get intellisense for the ng- directives in the HTML. I also get intellisense for most javascript files. However, I have no idea how to get intellisense for bits that are injected. Consider the following:
function mandatsCtrl($scope, Domiciliation, logger, $q) {
}
how to I get intellisense for $q or $scope, which are injected ?
I created a javascript file that you can reference that gives (nearly) complete AngularJS intellisense in JavaScript files, including on your custom factories, services and so forth.
https://github.com/jmbledsoe/angularjs-visualstudio-intellisense
As far as I know you can't do nothing like that.
But if you are using ReSharper you can try AngularJS support for ReSharper plugin. It's in the early stage so I guess we can expect a lot more over time.
Here's another link for HTML5Schema (all the ng-* attributes available in Intellisense).
I guess you already have that.
There is also a Chrome plugin AngularJS Batarang. Extends the Developer Tools, adding tools for debugging and profiling AngularJS applications.
I'm looking forward to other answers.
You can get intellisense on injected parameters (and just about everything else) if you use TypeScript. TypeScript let's you specify the type of your parameters so VS will know how to use them.
eg.
/// <reference path="./angular.d.ts" />
function mandatsCtrl($scope: ng.IScope) {...}
Have you taken a look at this: https://github.com/matijagrcic/AngularJS-Intellisense-For-Visual-Studio
I have got Intellisense for $scope and $q through one of the extensions I have (think it must be 'Web Essentials 2012'), although it doesn't seem to be particularly intelligent Intellisense - it's just suggestions of every single possible JS method/property.
Related
I'm working on my first Ionic (based on Angular 1.x) Typescript project. I'm finding that I'm spending way too much time looking around for the right type names to use for the various services, providers, etc.
I know that I can load up the actual .d.ts files themselves and inspect them (or, play around with Intellisense) to find the right types. However, it would be a whole lot easier to just glance at a cheat sheet/quick reference that looks something like the following:
Angular
$rootScope: angular.IRootScopeService
$scope: ng.IScope
$state: ng.ui.IStateProvider
$timeout: ng.ITimeoutService
Ionic
$ionicModal: ionic.modal.IonicModalService
$ionicLoading: ionic.loading.IonicLoadingService
$ionicPlatform: ionic.platform.IonicPlatformService
Cordova
etc.
Does such a reference exist? Or, could someone who is a bit more experienced than I throw together a quick guide? It would be immensely helpful for Typescript newcomers as the "language" becomes more mainstream.
Not sure, If this is the right place to ask this question as its not related to any coding area problem.
My project, developed in AngularJs with web api, using VS2015, have grown big in code and structure. I have written many modules with directives, controller and services. If I am using webstorm I can easily navigate to directive definition from html by pressing CTRL + Mouse Left Click.
Is there any way like plugin or addon which I can add to Visual studio and manage to get same functionality?
I tried this but not much useful.
Try to check out these articles:
https://blogs.msdn.microsoft.com/vscode/2015/05/21/getting-started-with-angular-and-visual-studio-code/
https://code.visualstudio.com/Docs/languages/javascript
I know they're tutorials for VS Code, but the shortcuts might be the same.
Angular highlighing stopped working.(For example I get undefined attribute ng-app). Before I had an option under configure to convert the project to an angular project, but that option is now missing.
I tried reinstalling angular plugin, I even updated to luna but I lost any angular capabilities.
Great light angular.js in webstorm with angular plugin, the better ispolzuite it and I think You will like it.
Оtherwise with eclipse try Eclipse AngularJS Plugin Configuration
http://www.youtube.com/watch?v=k2ulCdYz-zM
or
http://blog.diniscruz.com/2014/02/using-angularjs-in-eclipse-part-3-wire.html
Eclipse seems to be falling behind when it comes to writing angular code. I had issues trying to get a legitimate plugin for es6 as well. If you're willing to try out a new editor, you might want to consider intelliJ IDEA which will also allow you to write easily in Java or Spring.
If you're just writing angular, with no server side needs, vs code is free, lightweight, and incredibly handy. Before acquiring a license for intelliJ, I just opened up the angular part of my application in vs code and edited it there. You can even download angular "snippets" to scaffold common structures like controllers or routes for you.
By proper I mean intellisense for HTML and JavaScript, i.e.
Typing <div ng-></div> should show intellisense as below.
and typing (in .js files) angular. should promt me with intellisense for controller, config etc as seen below (i'm after a more accurate intellisense than shown below actually, it seem to be giving me regular JS support, not Angular).
I'l also like support for your own controllers, so in the case you've defined your customController and/or service with your customFunction, i'd like that to be shown as well.
Here you can read about Using AngularJS in Visual Studio 2013, the article explains how to copy-paste a special angular.intellisense.js file into your C:\ drive.
Here's a SO answer regarding how to enable AngularJS support for ReSharper in Visual Studio. When I try this I only get the HTML intellisense, I get nothing for JS files to work.
Mads Kristensen points out The story behind _references.js in VS that will add JavaScript intellisense for the files you like.
I get the impression that all these ways can be solutions to the same problem: Getting AngularJS support in VS, but which is the most neat approach? Currently i've tried all of them and I feel there something i'm doing wrong, as i'm not very impressed so far.
Thanks a bunch for any help!
Try dragging angular.min.js file directly on the top of your .js file
surely it'll enable all the inbuilt intellisense, not sure about the custom controllers or directives you make.
hope it helps you :)
write this at the top of .js file starting from 3 forward slashes => ///
I'm trying to run Angular's PhoneCat tutorial in Visual Studio as a web page project. I've gotten to step 2 (https://docs.angularjs.org/tutorial/step_02) and the web page is working fine. However, the unit test fails on the beforeEach line with the error:
TypeError: Unable to get property '$injector' of undefined or null reference
at workFn(...scripts\angular-mocks.js:2013:7)
I have a test without any mocking, so I know that all the other components are playing nicely together. Basically, Visual Studio 2013, ReSharper 8, and Jasmine 2 all appear to be working nicely. Outside of unit tests, the page itself works fine. It comes up and shows the three phones defined in the controller.
I'm not strong enough (yet) in javascript to dig in and figure it out, so I'm coming here to ask for some help. You can see all the code on my github at https://github.com/qanwi1970/PhoneCat-VS/tree/develop. If my group goes forward with Angular, then being able to write meaningful unit tests in Visual Studio is very important.
Thanks for your help and tips.
UPDATE: I have discovered that the /// comments at the top of the js file tell Visual Studio of the required javascript files (for Intellisense and such) but it does not tell the test runners. I need to leave for the day, but that's the angle I'll be working tomorrow. How do I tell ReSharper/Chutzpah controllerSpec.js needs controller.js? This question is probably already answered, but I'm out of time for the day.
Make sure you're using ReSharper 8.2.1. There were some fixes there for Jasmine 2.0 support that could result in an error similar to this.