6

I am importing angular in my angular 1 app (in typescript) using syntax like below

   import * as angular from 'angular';

This imports angular from angular-mocks and not from angular because of which my ILogService implementation fails

ERROR in ./app/shared/Logger.factory.ts (38,7): error TS2420: Class 'Logger' incorrectly implements interface 'ILogService'. Types of property 'debug' are incompatible. Type '(...argument: any[]) => void' is not assignable to type 'ILogCall'.

Even when I try to navigate to 'angular' from vscode I get navigated to angular-mocks angular definition. It should get navigated to angular and not to mock library...

How to avoid this problem?

EDIT

Below is the implementation of

The implementation I have is custom service about which typescript gives an error during compilation (the error is pasted above)

class Logger implements ng.ILogService {
     info(message:string) { //some custom logic in info method}
}

angular.service('logger', Logger)
2
  • 2
    because of which my ILogService implementation fails - which implementation? Please, provide all code that is necessary to replicate the problem. See stackoverflow.com/help/mcve . This imports angular from angular-mocks and not from angular - where did this conclusion come from? The way how VS Code navigates between classes affects only the way how it navigates, nothing else. Commented Sep 18, 2017 at 9:21
  • See: stackoverflow.com/q/40664298/4110233. The answers are here Commented Sep 21, 2017 at 3:29

2 Answers 2

1

It's caused because angular-mock's typing is an augmentation to angular's. In other words, a real ILogCall interface should be:

interface ILogCall {
    (...args: any[]): void;   //from @types\angular\index.d.ts
    logs: string[];    //from @types\angular-mocks\index.d.ts
}

So in your code:

info(message:string) { //some custom logic in info method}

you need to return a correct ILogCall object(with all members). @TheChetan and @Natarajan Nagarajugari 's answer may be helpful, but I am not sure whether it would break your TypeScript writing unit tests.

My solution is in info(message:string):

info(message:string)
{
    var logCall: any = (...args: any[]) => {};
    logCall.logs = //something;

    return logCall as ng.ILogCall;
}
Sign up to request clarification or add additional context in comments.

2 Comments

so if I am not wrong, you are suggesting to implement both interfaces
this is kind of OK solution, but is there a way where I can disable loading of definitions from angular-mocks
1

try this..

import * as _angular_ from 'angular';

declare global {
const angular: typeof _angular_;
}

Hope it would help you

1 Comment

it would be helpful if you can explain this answer as to why it will work

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.