Using fullTemplateTypeCheck flag in the typescript angularCompilerOptions raise an error

[maxailloud]

I was updating the angularCompilerOptions in my tsconfig.json file for an external module I am developing and here is the error I got when I turned on the fullTemplateTypeCheck:

Error: Command failed: ngc -p /Users/max/workspace/core/.tmp
../node_modules/angular2-toaster/src/toaster-container.component.d.ts.ToasterContainerComponent.html(8,17): : Element implicitly has an 'any' type because type 'Object' has no index signature.
../node_modules/angular2-toaster/src/toaster-container.component.d.ts.ToasterContainerComponent.html(5,17): : Element implicitly has an 'any' type because type 'Object' has no index signature.

I guess the compiler doesn't like the use of the any type at line 86 and 87 of the toaster-container.component.

I am saying that because in the AoT documentation of Angular for this option it's written

Note: It is recommended to set this to true as this option will default to true in the future.

So maybe it might be a good idea to see to fix this.

[Stabzs]

This is actually a duplicate of #148 and Andrew was kind enough to create a PR for the fix which I'll fold in.

That said, this is useful because it explains why I missed it...I didn't know about the fullTemplateTypeCheck flag and I did NOT turn it on. I'll make sure to add that to the AOT compilation so that these issues are preemptively caught going forward.

Thanks!

[maxailloud]

Oh I didn't see this one my bad.
Ok perfect.

You are welcome.

[Stabzs]

No problem at all and again, thanks for pointing out the flag. This will get folded into a release today.

[Stabzs]

@maxailloud could you give me a very specific example of exactly how to generate the compiler warnings? I've spun up new angular-cli projects running against 1.7.1 and 1.7.3 and I can't seem to generate the warning. Thanks!

[maxailloud]

I am using https://www.npmjs.com/package/ngm-cli to build an external module for my applications, basically it's a wrapper for ngc. An so I am not using angular-cli in this project.

Adding the compiler options in my tsconfig.json raised the error:

{
    "compilerOptions": {
        "outDir": "../dist",
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": true,
        "sourceMap": true,
        "inlineSources": true,
        "noEmitHelpers": false,
        "noImplicitAny": true,
        "declaration": true,
        "skipLibCheck": false,
        "stripInternal": true,
        "noUnusedLocals": false,
        "noUnusedParameters": false,
        "lib": ["es2016", "dom", "es6"]
    },
    "exclude": [
        "node_modules"
    ],
    "files": [
        "./index.ts"
    ],
    "angularCompilerOptions": {
        "skipTemplateCodegen": true,
        "strictMetadataEmit": true,
        "strictInjectionParameters": true,
        "fullTemplateTypeCheck": false,
        "annotationsAs": "static fields",
        "preserveWhitespaces": false
    }
}

I am obviously using the angular-toaster module in one of the few modules in my package.
After I cannot really show you the code, company code, so I hope i can help anyway.

[Stabzs]

Completely understandable and this is very helpful, thank you!! What mode is ngc running in for your project or are you not passing any sort of flag to ngc?

[maxailloud]

The only thiing I can tell you is that the command ngc -p /Users/max/workspace/core/.tmp is launch by ngm-cli, among other things. The .tmp folder being the folder where all of my code has been moved and inlined (external template and style).
I get to see the executed command when there is an error like this one, otherwise it's completely transparent to me.

[Stabzs]

I still can't reproduce this issue with those flags and angular-cli. I'm going to build a sample with ngm-cli and see if I can create a reproduceable example.

I want the example so that I can catch this sort of thing during development going forward. Thanks for the information!

[maxailloud]

Yeah I think angular-cli and ngm-cli have some difference even though they should both using ngc as compiler. But after angular-cli uses webpack too I think to build, correct me if i'm wrong, the difference might be from that.