What object type is the instance element parameter pass into the link function of an angular directive?

angularjs, d3.js, typescript

Solution

`$element` in the `link` function of a Directive has the type `ng.IAugmentedJQuery`. If you include jQuery then you will get the jQuery functions on `$element`, without jQuery then Angular will provide jqLite. See here for more information.

The `link` function in `ng.IDirective` is defined as:

link?: (scope: IScope,
        instanceElement: IAugmentedJQuery,
        instanceAttributes: IAttributes,
        controller: any,
        transclude: ITranscludeFunction
       ) => void;

Problem

I am using typescript with angular and trying to create a custom directive. I am attempting to give all my parameters types, but am not sure what type the object that is pass through the $element parameter is. Is it JQuery type? Or some Element type? In the directive code, I want to use $element with a d3 selector. (i.e. d3.select($element)) Currently the d3 selection statement doesn't work because the $element type is not one that is expected by d3. (I'm using a typescript interface for d3 as well.) ``` var directiveDefinitionObject : ng.IDirective = { restrict: 'E', replace: false, scope: { data: '=chartData' }, link: ($scope: ICustomScope, $element: <WHAT_TYPE?>) => { d3.select($element); // d3.select(node) } }; ```

Original source