vscode-ng-language-service: The template context does not define a member called 'item'

Describe the bug

Not sure if this issue is related to this extension, but the code does compile and work even if the language service gives me an error in the console.

In a component.html file I have this:

<ng-template ng-label-tmp ng-option-tmp let-item="item">
    {{ item.name }} -- {{ item.description }} -- {{ item.price | currency }}
</ng-template>

the let-item="item" piece is red highlighted and this is the description:

The template context does not define a member called ‘item’

To Reproduce Use any *-tmp directives along with let-* ones.

Expected behavior No Errors should be highlighted for the let-item="item" directive.

Logs

Console output

[Info  - 17:40:22] Angular language server process ID: 21305
[Info  - 17:40:22] Using typescript v3.7.4 from /home/user/.vscode/extensions/angular.ng-template-0.900.5/node_modules/typescript/lib/tsserverlibrary.js
[Info  - 17:40:24] Using @angular/language-service v9.0.0-rc.9 from /home/user/.vscode/extensions/angular.ng-template-0.900.5/server/node_modules/@angular/language-service/bundles/language-service.umd.js
[Info  - 17:40:25] Log file: /home/user/.config/Code/logs/20200123T153034/exthost9/Angular.ng-template/nglangsvc.log
[Error - 17:40:39] No config file for /home/user/git/projects/my-app/src/app/ui-widgets/app-card/add-item-card/add-item-card.component.html

Log file nglangsvc.log

Additional context If I remove both ng-label-tmp and ng-option-tmp directives the error disappears.

UPDATE Downgrading the extension to v0.900.4 the message error disappears. The v0.900.5 starts to show this error.

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 6
Comments: 17 (7 by maintainers)

Commits related to this issue

fix(language-service): warn, not error, on missing context members The language service reports an error when a directive's template context is missing a member that is being used in a template (e.g.... — committed to ayazhafiz/angular by deleted user 4 years ago
fix(language-service): warn, not error, on missing context members The language service reports an error when a directive's template context is missing a member that is being used in a template (e.g.... — committed to ayazhafiz/angular by deleted user 4 years ago
fix(language-service): warn, not error, on missing context members (#35036) The language service reports an error when a directive's template context is missing a member that is being used in a templ... — committed to angular/angular by deleted user 4 years ago
fix(language-service): warn, not error, on missing context members (#35036) The language service reports an error when a directive's template context is missing a member that is being used in a templ... — committed to angular/angular by deleted user 4 years ago
fix(language-service): warn, not error, on missing context members (#35036) The language service reports an error when a directive's template context is missing a member that is being used in a templ... — committed to sonukapoor/angular by deleted user 4 years ago

Most upvoted comments

@fdinardo okay, the PR above (https://github.com/angular/angular/pull/35036) will make this a warning 🙂

ayazhafiz on Jan 29, 2020

When diagnostics are performed in the language service, the context for the embedded view is assumed to be the context of the structural directive that is applied to ng-template. This assumption is incorrect, according to the docs in angular.io:

Angular automatically expands the shorthand syntax as it compiles the template. The context for each embedded view is logically merged to the current component context according to its lexical position.

kyliau on Jan 24, 2020

Is there anything we can do to help fix this? There’s been a couple of patches since 900.5, and this is still an issue.

tabinnorway on Jan 28, 2020

The fix will be included in v0.900.8 scheduled to be published on Thursday Jan 30 (PST)

kyliau on Jan 29, 2020

I saw the PR right now! Your solution is perfect, it’s a warning but not a big one! it tells us that something is potentially wrong, but could not be blocking!

Thanks… I am Very happy with this PR 🙂

I think we can close this.

fdinardo on Jan 29, 2020

I just don’t get why this diagnostic message doesn’t come up with v9.000.4 and previous versions!

I agree, this is a strange. Recently there has been a lot of development on the language service, especially with respect to template bindings and variables. I think this is just one case we didn’t catch correctly before.

leading us to lost focus on the work and figure out if it’s a “real” error or this (which actually compiles correctly).

As far as I’m aware, the Angular compiler does not perform a check on the members made available by the template context; for me, AOT compilation with TemplateRef<null> seemed to work. At least for now, this diagnostic message is caused by the language service’s attempt to provide some additional type checking.

With that, I think there are at least four ways to proceed:

Keep diagnostic as it is, with the “better” message mentioned in #251 and added in https://github.com/angular/angular/pull/34751
Reduce the severity of the diagnostic from an error to a warning or suggestion
Make a special case for allowing any members when the context is any or object. I don’t like this option, as it is very brittle and and would not fix the cases for other “base” contexts (like base classes)
Remove the diagnostic entirely

Curious to hear others’ thoughts.

ayazhafiz on Jan 29, 2020

Hi thanks for the answer. I looked at #251, I don’t think it’s the same case, because #251 has been opened on 18 May 2018. Until 2 days ago this error didn’t show up. It started with ng-language-service v0.900.5 and above.

The definitions of those directives are in a third party package.

For now, I just downgraded the extension to v0.900.4 which is the latest that was working without that error.

fdinardo on Jan 24, 2020