AngularJS IDirectiveLinkFn interface

Question

Examples for implementing the directive's link method in typescript use as the fourth parameter instance of ng.INgModelController

public link($scope: ng.IScope, el: JQuery, attrs: ng.IAttributes, ngModel: ng.INgModelController)

but this does not compile for me (I have the latest angularjs.TypeScript.DefinitelyTyped 6.5.6 installed), because the interface IDirectiveLinkFn expects as the fourth parameter instance of IController and not INgModelController.

If the fourth parameter is modified to be of type IController, now it compiles, but the interfaces are very different. How is it possible after this change to access the model properties ngModel.$viewValue or ngModel.$render inside link function?

The packages.config contains these packages:

<package id="angularjs.TypeScript.DefinitelyTyped" version="6.5.6" targetFramework="net452" />
<package id="angular-material.TypeScript.DefinitelyTyped" version="1.6.4" targetFramework="net452" />
<package id="angular-ui.TypeScript.DefinitelyTyped" version="2.4.3" targetFramework="net452" />

Answer 1

Since INgModelController doesn't extend IController and isn't compatible with it (this is an oversight in AngularJS typing), the solution is to use union type:

public link($scope: ng.IScope, el: JQuery, attrs: ng.IAttributes, 
  ngModel: ng.INgController & ng.INgModelController) {...}

Answer 2

Do you have @types declarations installed ? For example, in "@types/angular": "^1.6.43", in IController type you will find the next options:

// IController implementations frequently do not implement any of its methods.
// A string indexer indicates to TypeScript not to issue a weak type error in this case.
[s: string]: any;

If I correct, this means you can use any of properties from the IController type.

Another option is to use a type coercion, something like this:

let viewValue = (ngModel as ng.INgModelController).$viewValue;