How can I add in Typescript typings for AngularJS $q and $http?

Question

In my code I have this:

/// <reference path="../../../../scripts/typings/angularjs/angular.d.ts" />

angular.module('question')
    .controller('QuestionHomeController', [
        '$http',
        'enumService',
        '$q',
        '$rootScope',
        '$scope',
        '$state',
        questionHomeController]);

function questionHomeController(
    $http,
    enumService,
    $q,
    $rootScope,
    $scope,
    $state
    ) {

Can someone tell me how I can add Typescript typing for the $http and the $q? I already reference the AngularJS type definition files but the typings still do not show up

Answer 1

If you have the typings included in your project, you just need to use it as the type for the variables, so that you get the properties/functions on that type show up on the intellisense.

angular.module('question')
    .controller('QuestionHomeController', [
        '$http',
        'enumService',
        '$q',
        '$rootScope',
        '$scope',
        '$state',
        questionHomeController]);

function questionHomeController(
    $http : ng.IHttpService,
    enumService,
    $q: ng.IQService,
    $rootScope : ng.IRootScopeService,
    $scope : ng.IScope,
    $state : ng.ui.IStateService
    ) {

Similarly you can also specify the interface type for the service example for enumService. Also you can extend the existing types as well. For example your scope has its own function and you use scope as your viewModel then:-

interface IquestionHomeViewModel extends ng.IScope {
        func1(arg:string):void;
        ...

}

and you would use it as:-

$scope : IquestionHomeViewModel ,