New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support indexed types #126
Comments
@virgil-av Can you create a repository that reproduces this issue? |
We have same issue with union type. Like public Hour: TimeSpan | string; Error: hhMM is a valid member in TimeSpan but it seem Hour is treated like a any ;( |
I'm also experiencing this issue with reactive forms. A temporary workaround is to access the property using a bracket propety accessor expression. formRegister.controls['company'].invalid |
Also getting this actually. I believe this used to be an issue in TS as well but seems to be working now for me. At least in TS 2.4.0 and Angular 4.3.0: Here's the type definition for the FormGroup.controls property: https://github.com/angular/angular/blob/master/packages/forms/src/model.ts#L832
These both work in TS for me but dot notation complains within the language service:
|
@intellix Same here |
Same in |
i have the same problem in tsc v2.5.2 as friends said |
@chuckjaz I can create something better: no repository. Because I have tested and found that this issue is not related to the source code or npm packages at all. I started having this problem and then tested logging in as a different user, starting visual studio code in the very same directory and then I did not get the error in that editor. This is also consistent with that the error only shows up in the editor and the compiler does not complain when building. So, obviously a per user difference. Then I tested removing the config directory, and the problem went away. When moving the old directory back again the problem re-appears. $ mv ~/.config/{,old.}Code
$ code .
$ mv ~/.config/{,new.}Code
$ mv ~/.config/{old.,}Code
$ code . So some cruft has gotten into the config directory that triggers this (some cache would be my guess). When hovering the mouse over |
I tracked down the user difference, and it is the instalment of the vscode extension
The patch is relative to Since angular-electron-dream-starter is a fork of https://github.com/AngularClass/angular-starter, I tested the patch in that repo as well, and there the problem does not occur but instead the tooltip contains valid information: Originally tested on vscode version 1.17.2 (commit b813d129). After updating to version 1.8.0 (commit dcee22027) the result is the same. Due to Github's utterly stupid attachment handling, the patch is base64 encoded here: RnJvbSAyYzgxMTJmYzJhM2I2M2FkZjVmZjA0MDQ3NTcyNjAyMjc2ZWMwYmZiIE1vbiBTZXAgMTcg |
I'm facing the similar issue. It appears that plugin only recognizes variables declared directly in the class but not the ones nested under formGroup or formBuilder.
this on the other hand does not give the error squigglies as i have declared FormControl in class directly(this is not a solution unfortunately because angular does not allow formcontrol declaration outside of the formgroup)-
|
@hlovdal I tried your repro steps, but I could not produce the error. It seems to work fine. |
@kyliau I ran into this issue today with VS Code v1.21.1 on Windows, Typescript 2.3.4 and Angular.ng-template v0.1.9. Here is how I create the form:
and in the template I try to reach for it like this:
getting this error:
When negated, it does not throw the error (meaning that only |
I have been searching for a workaround to this for ages - thanks |
@guhyeon thanks but can you explain what this does? |
@rubenheymans |
I've tried using this workaround instead, which also stops the vscode Angular Language Service from complaining:
Further typings could probably be available for known errorCodes, as well as custom validators |
|
I think under the hood this is the same issue as #149 -- referencing an object with an index-signature by index ( |
I got this today with a simple <input [(ngModel)]="search"> where 'search' was undefined and was giving me red squiggles. |
Here's mine work around solution if you don't like the "!!" on html. your.component.ts : get emailFormControl(): any { your.component.html : <mat-error *ngIf="emailFormControl.errors?.required">Please Enter a valid email. This solution works for me, without giving any compile error / runtime error . |
Esto me funcionó: |
Also experiencing exactly the same problem. FormGroup controls created in FormBuilder are not known the VSCode's intellisense for the view template. Any idea if there is an actual fix possible for this, rather than the !! workaround |
You can use square bracket instead of dot operator to access the property name. This could fix your compilation error. |
This is still happening with Angular 8.1.3, with both custom and built-in forms validators (e.g. required). Would be awesome if the registered validators would be clear for intellisense. Running VSC 1.36.1. Workaround: use bracket annotation instead of dot-annotation, or use !!formcontrol.errors.required The workaround makes me think if intellisense might mark it due to it's undefined value? Since the errors object is not a set of true/false flags but defined by existence of said flags (which is IMO an unusual pattern), I could imagine intellisense having issues with that. |
@ivanwonder have already created PR for this issue. So let's wait until they merge it. |
Workaround: Instead of:
use:
|
I'm glad there is a workaround... but has any progress been made while investigating the issue? This issue still exists on v0.802.3 |
Commit 53fc2ed added support for determining index types accessed using index signatures, but did not include support for index types accessed using dot notation: ```typescript const obj<T>: { [key: string]: T }; obj['stringKey']. // gets `T.` completions obj.stringKey. // did not peviously get `T.` completions ``` This adds support for determining an index type accessed via dot notation by rigging an object's symbol table to return the string index signature type a property access refers to, if that property does not explicitly exist on the object. This is very similar to @ivanwonder's work in angular#29811. `SymbolWrapper` now takes an additional parameter to explicitly set the type of the symbol wrapped. This is done because `SymbolTableWrapper#get` only has access to the symbol of the index type, _not_ the index signature symbol itself. An attempt to get the type of the index type will give an error. Closes angular#29811 Closes angular/vscode-ng-language-service#126
Commit 53fc2ed added support for determining index types accessed using index signatures, but did not include support for index types accessed using dot notation: ```typescript const obj<T>: { [key: string]: T }; obj['stringKey']. // gets `T.` completions obj.stringKey. // did not peviously get `T.` completions ``` This adds support for determining an index type accessed via dot notation by rigging an object's symbol table to return the string index signature type a property access refers to, if that property does not explicitly exist on the object. This is very similar to @ivanwonder's work in angular#29811. `SymbolWrapper` now takes an additional parameter to explicitly set the type of the symbol wrapped. This is done because `SymbolTableWrapper#get` only has access to the symbol of the index type, _not_ the index signature symbol itself. An attempt to get the type of the index type will give an error. Closes angular#29811 Closes angular/vscode-ng-language-service#126
…ion (#33884) Commit 53fc2ed added support for determining index types accessed using index signatures, but did not include support for index types accessed using dot notation: ```typescript const obj<T>: { [key: string]: T }; obj['stringKey']. // gets `T.` completions obj.stringKey. // did not peviously get `T.` completions ``` This adds support for determining an index type accessed via dot notation by rigging an object's symbol table to return the string index signature type a property access refers to, if that property does not explicitly exist on the object. This is very similar to @ivanwonder's work in #29811. `SymbolWrapper` now takes an additional parameter to explicitly set the type of the symbol wrapped. This is done because `SymbolTableWrapper#get` only has access to the symbol of the index type, _not_ the index signature symbol itself. An attempt to get the type of the index type will give an error. Closes #29811 Closes angular/vscode-ng-language-service#126 PR Close #33884
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
When using reactive forms, in the HTML template I get the error in the title.
<ion-item *ngIf="formRegister.controls.company.invalid && formRegister.controls.company.touched">
Please enter a valid name.
Both "formRegister.controls.company.invalid && formRegister.controls.company.touched" are underlined as an error but the app works just fine.
The text was updated successfully, but these errors were encountered: