Vscode-ng-language-service: Unterstützt indizierte Typen

Erstellt am 7. Juli 2017  ·  32Kommentare  ·  Quelle: angular/vscode-ng-language-service

Bei Verwendung reaktiver Formulare erhalte ich in der HTML-Vorlage den Fehler im Titel.


Bitte geben Sie einen gültigen Namen ein.


Beide "formRegister.controls.company.invalid && formRegister.controls.company.touched" sind als Fehler unterstrichen, aber die App funktioniert einwandfrei.

bug

Hilfreichster Kommentar

Ich habe dieses Problem auch bei reaktiven Formularen.

Eine vorübergehende Problemumgehung besteht darin, mithilfe eines Klammer-Propety-Accessor-Ausdrucks auf die Eigenschaft zuzugreifen.

formRegister.controls['company'].invalid

Alle 32 Kommentare

@ virgil-av Können Sie ein Repository erstellen, das dieses Problem reproduziert?

Wir haben das gleiche Problem mit dem Gewerkschaftstyp. Mögen

öffentliche Stunde: TimeSpan | Zeichenfolge;

Error:
Der Bezeichner 'hhMM' ist nicht definiert. ''enthält kein solches Mitglied

hhMM ist ein gültiges Mitglied in TimeSpan, aber es scheint, dass Hour wie ein beliebiges behandelt wird.

@wupaz Ihr Beispiel wird erwartet, da der String nicht hhMM als Mitglied ist und ein Unionstyp nur die Mitglieder hat, die die konstituierenden Typen gemeinsam haben.

TypeScript meldet einen ähnlichen Fehler

Ich habe dieses Problem auch bei reaktiven Formularen.

Eine vorübergehende Problemumgehung besteht darin, mithilfe eines Klammer-Propety-Accessor-Ausdrucks auf die Eigenschaft zuzugreifen.

formRegister.controls['company'].invalid

Auch das eigentlich bekommen. Ich glaube, dass dies früher auch bei TS ein Problem war, aber jetzt scheint es für mich zu funktionieren. Zumindest in TS 2.4.0 und Angular 4.3.0:

Hier ist die Typdefinition für die Eigenschaft FormGroup.controls: https://github.com/angular/angular/blob/master/packages/forms/src/model.ts#L832

(property) FormGroup.controls: {
    [key: string]: AbstractControl;
}

Diese beiden funktionieren für mich in TS, aber die Punktnotation beschwert sich innerhalb des Sprachdienstes:

form.controls['birthday']
form.controls.birthday

@intellix Gleich hier

Gleiches gilt für v2.5.2 .

Ich habe das gleiche Problem in TSC 2.2.2 wie Freunde sagten

Können Sie ein Repository erstellen, das dieses Problem reproduziert?

@chuckjaz Ich kann etwas besseres erstellen: kein Repository.

Weil ich getestet und festgestellt habe, dass dieses Problem überhaupt nicht mit dem Quellcode oder den npm-Paketen zusammenhängt. Ich hatte dieses Problem und habe dann getestet, wie ich mich als anderer Benutzer anmeldete, Visual Studio-Code im selben Verzeichnis startete und dann den Fehler in diesem Editor nicht bekam.

error_screenshot

Dies steht auch im Einklang damit, dass der Fehler nur im Editor angezeigt wird und der Compiler sich beim Erstellen nicht beschwert.

Also offensichtlich ein Unterschied pro Benutzer. Dann habe ich getestet, wie das Konfigurationsverzeichnis entfernt wurde, und das Problem ist behoben. Wenn Sie das alte Verzeichnis wieder zurück verschieben, tritt das Problem erneut auf.

$ mv  ~/.config/{,old.}Code
$ code .
$ mv  ~/.config/{,new.}Code
$ mv  ~/.config/{old.,}Code
$ code .

Also ist etwas Cruft in das Konfigurationsverzeichnis gelangt, das dies auslöst (ein Cache wäre meine Vermutung). Wenn Sie die Maus direkt nach dem Starten des Editors über valid von name.valid bewegen, wird einige Sekunden lang ein Tooltip von "Laden ..." angezeigt, bevor er verschwindet und der Fehler auftritt. Beim zweiten Mal und später wird der Fehler beim Schweben sofort angezeigt.

Ich habe den Benutzerunterschied aufgespürt und es ist die Folge der vscode-Erweiterung Angular.ng-template Version 0.1.7. Und ich kann jetzt auch ein Repository bereitstellen, das dieses Problem reproduziert:

  1. Klonen Sie https://github.com/colinskow/angular-electron-dream-starter
  2. Wenden Sie den angehängten Patch an.
  3. Öffnen Sie src / app / hero-form.component.html.
  4. a) Wenn Angular.ng-template installiert ist, werden name.valid und vier weitere Bezeichner rot unterstrichen (und [Angular] Identifier 'valid' is not defined. 'NgModel' does not contain such a member Tooltip-Fehler).
    b) Wenn Angular.ng-template nicht installiert oder deaktiviert ist, treten keine Fehler auf.

Der Patch ist relativ zu v7.0.0 , aber ich habe ihn auch gegen Commit bd5ad5f0 (Feature / ng2 rc5 (# 875)) vom 21.08.2016 getestet. Dies ist das erste Commit, das src / app / app.module enthält .ts, und der Fehler ist auch dort aufgetreten, daher gehe ich davon aus, dass dies ein Problem für alle Versionen dieses Repos ist.

Da Angular-Electron-Dream-Starter eine Abzweigung von https://github.com/AngularClass/angular-starter ist , habe ich den Patch auch in diesem Repo getestet, und dort tritt das Problem nicht auf, sondern der Tooltip enthält gültige Informationen ::

no error

Ursprünglich auf vscode Version 1.17.2 getestet (Commit b813d129). Nach dem Update auf Version 1.8.0 (Commit dcee22027) ist das Ergebnis dasselbe.


Aufgrund von Githubs völlig dummem Umgang mit Anhängen ist der Patch hier base64-codiert:

RnJvbSAyYzgxMTJmYzJhM2I2M2FkZjVmZjA0MDQ3NTcyNjAyMjc2ZWMwYmZiIE1vbiBTZXAgMTcg
MDA6MDA6MDAgMjAwMQpGcm9tOiA9P1VURi04P3E / SD1DMz1BNWtvbj0yMEw9QzM9Qjh2ZGFsPz0g
PGtvZGVAZGVua3VsZS5ubz4KRGF0ZTogRnJpLCAxNyBOb3YgMjAxNyAyMDozMDoyMCArMDEwMApT
dWJqZWN0OiBbUEFUQ0hdIEltcG9ydCBvZiBleGFtcGxlIGZyb20gaHR0cHM6Ly9hbmd1bGFyLmlv
L2d1aWRlL2Zvcm1zCgotLS0KIHNyYy9hcHAvYXBwLmNvbXBvbmVudC5odG1sICAgICAgIHwgNDAg
KysrKysrKysrKysrKysrKysrKysrKysrKysrCiBzcmMvYXBwL2FwcC5tb2R1bGUudHMgICAgICAg
ICAgICB8ICA1ICsrKy0KIHNyYy9hcHAvaGVyby1mb3JtLmNvbXBvbmVudC5odG1sIHwgNTggKysr
KysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKwogc3JjL2FwcC9oZXJvLWZvcm0u
Y29tcG9uZW50LnRzICAgfCAyMSArKysrKysrKysrKysrKysKIHNyYy9hcHAvaGVyby50cyAgICAg
ICAgICAgICAgICAgIHwgIDkgKysrKysrKwogNSBmaWxlcyBjaGFuZ2VkLCAxMzIgaW5zZXJ0aW9u
cygrKSwgMSBkZWxldGlvbigtKQogY3JlYXRlIG1vZGUgMTAwNjQ0IHNyYy9hcHAvYXBwLmNvbXBv
bmVudC5odG1sCiBjcmVhdGUgbW9kZSAxMDA2NDQgc3JjL2FwcC9oZXJvLWZvcm0uY29tcG9uZW50
Lmh0bWwKIGNyZWF0ZSBtb2RlIDEwMDY0NCBzcmMvYXBwL2hlcm8tZm9ybS5jb21wb25lbnQudHMK
IGNyZWF0ZSBtb2RlIDEwMDY0NCBzcmMvYXBwL2hlcm8udHMKCmRpZmYgLS1naXQgYS9zcmMvYXBw
L2FwcC5jb21wb25lbnQuaHRtbCBiL3NyYy9hcHAvYXBwLmNvbXBvbmVudC5odG1sCm5ldyBmaWxl
IG1vZGUgMTAwNjQ0CmluZGV4IDAwMDAwMDAuLmY4YWE1N2EKLS0tIC9kZXYvbnVsbAorKysgYi9z
cmMvYXBwL2FwcC5jb21wb25lbnQuaHRtbApAQCAtMCwwICsxLDQwIEBACis8bmF2PgorCTxhIFty
b3V0ZXJMaW5rXT0iIFsnLi8nXSAiCisJCXJvdXRlckxpbmtBY3RpdmU9ImFjdGl2ZSIgW3JvdXRl
ckxpbmtBY3RpdmVPcHRpb25zXT0gIntleGFjdDogdHJ1ZX0iPgorCQlJbmRleAorCTwvYT4KKwk8
YSBbcm91dGVyTGlua109IiBbJy4vaG9tZSddICIKKwkJcm91dGVyTGlua0FjdGl2ZT0iYWN0aXZl
IiBbcm91dGVyTGlua0FjdGl2ZU9wdGlvbnNdPSAie2V4YWN0OiB0cnVlfSI + CisJCUhvbWUKKwk8
L2E + CisJPGEgW3JvdXRlckxpbmtdPSIgWycuL2RldGFpbCddICIKKwkJcm91dGVyTGlua0FjdGl2
ZT0iYWN0aXZlIiBbcm91dGVyTGlua0FjdGl2ZU9wdGlvbnNdPSAie2V4YWN0OiB0cnVlfSI + CisJ
CURldGFpbAorCTwvYT4KKwk8YSBbcm91dGVyTGlua109IiBbJy4vYmFycmVsJ10gIgorCQlyb3V0
ZXJMaW5rQWN0aXZlPSJhY3RpdmUiIFtyb3V0ZXJMaW5rQWN0aXZlT3B0aW9uc109ICJ7ZXhhY3Q6
IHRydWV9Ij4KKwkJQmFycmVsCisJPC9hPgorCTxhIFtyb3V0ZXJMaW5rXT0iIFsnLi9hYm91dCdd
ICIKKwkJcm91dGVyTGlua0FjdGl2ZT0iYWN0aXZlIiBbcm91dGVyTGlua0FjdGl2ZU9wdGlvbnNd
PSAie2V4YWN0OiB0cnVlfSI + CisJCUFib3V0CisJPC9hPgorPC9uYXY + CisKKzxtYWluPgorCTxh
cHAtaGVyby1mb3JtPjwvYXBwLWhlcm8tZm9ybT4KKwk8cm91dGVyLW91dGxldD48L3JvdXRlci1v
dXRsZXQ + Cis8L21haW4 + CisKKzxwcmUgY2xhc3M9ImFwcC1zdGF0ZSI + dGhpcy5zdGF0ZSQgPSB7
eyBzdGF0ZSQgfCBhc3luYyB8IGpzb24gfX08L3ByZT4KKworPGZvb3Rlcj4KKwk8c3Bhbj4KKwkJ
QW5ndWxhciBFbGVjdHJvbiBEcmVhbSBTdGFydGVyIGJ5IDxhIChjbGljayk9Im9wZW5VUkwodXJs
KSIgaHJlZj0iIyI + QENvbGluU2tvdzwvYT4KKwk8L3NwYW4 + CisJPGRpdj4KKwkJPGEgW2hyZWZd
PSJ1cmwiPgorCQkJPGltZyBbc3JjXT0iYW5ndWxhcmNsYXNzTG9nbyIgd2lkdGg9IjI1JSI + CisJ
CTwvYT4KKwk8L2Rpdj4KKzwvZm9vdGVyPgpkaWZmIC0tZ2l0IGEvc3JjL2FwcC9hcHAubW9kdWxl
LnRzIGIvc3JjL2FwcC9hcHAubW9kdWxlLnRzCmluZGV4IGZlYzI0NTcuLjFjNjEyZWIgMTAwNjQ0
Ci0tLSBhL3NyYy9hcHAvYXBwLm1vZHVsZS50cworKysgYi9zcmMvYXBwL2FwcC5tb2R1bGUudHMK
QEAgLTc3LDYgKzc3LDggQEAgaWYgKEVOViA9PT0gJ2RldmVsb3BtZW50JykgewogICBDT05ESVRJ
T05BTF9JTVBPUlRTLnB1c2goU3RvcmVNb2R1bGUuZm9yUm9vdChyZWR1Y2VycywgeyBtZXRhUmVk
dWNlcnMgfSkpOwogfQogCitpbXBvcnQgeyBIZXJvRm9ybUNvbXBvbmVudCB9IGZyb20gJy4vaGVy
by1mb3JtLmNvbXBvbmVudCc7CisKIC8qKgogICogYEFwcE1vZHVsZWAgaXMgdGhlIG1haW4gZW50
cnkgcG9pbnQgaW50byBBbmd1bGFyMidzIGJvb3RzdHJhcGluZyBwcm9jZXNzCiAgKi8KQEAgLTg3
LDcgKzg5LDggQEAgaWYgKEVOViA9PT0gJ2RldmVsb3BtZW50JykgewogICAgIEFib3V0Q29tcG9u
ZW50LAogICAgIEhvbWVDb21wb25lbnQsCiAgICAgTm9Db250ZW50Q29tcG9uZW50LAotICAgIFhM
YXJnZURpcmVjdGl2ZQorICAgIFhMYXJnZURpcmVjdGl2ZSwKKyAgICBIZXJvRm9ybUNvbXBvbmVu
dCwKICAgXSwKICAgaW1wb3J0czogWyAvLyBpbXBvcnQgQW5ndWxhcidzIG1vZHVsZXMKICAgICBC
cm93c2VyTW9kdWxlLApkaWZmIC0tZ2l0IGEvc3JjL2FwcC9oZXJvLWZvcm0uY29tcG9uZW50Lmh0
bWwgYi9zcmMvYXBwL2hlcm8tZm9ybS5jb21wb25lbnQuaHRtbApuZXcgZmlsZSBtb2RlIDEwMDY0
NAppbmRleCAwMDAwMDAwLi4wZmM2YjgxCi0tLSAvZGV2L251bGwKKysrIGIvc3JjL2FwcC9oZXJv
LWZvcm0uY29tcG9uZW50Lmh0bWwKQEAgLTAsMCArMSw1OCBAQAorICAgIDxkaXYgY2xhc3M9ImNv
bnRhaW5lciI + CisgICAgICA8ZGl2IFtoaWRkZW5dPSJzdWJtaXR0ZWQiPgorICAgICAgICA8aDE +
SGVybyBGb3JtPC9oMT4KKyAgICAgICAgPGZvcm0gKG5nU3VibWl0KT0ib25TdWJtaXQoKSIgI2hl
cm9Gb3JtPSJuZ0Zvcm0iPgorICAgICAgICAgIDxkaXYgY2xhc3M9ImZvcm0tZ3JvdXAiPgorICAg
ICAgICAgICAgPGxhYmVsIGZvcj0ibmFtZSI + TmFtZTwvbGFiZWw + CisgICAgICAgICAgICA8aW5w
dXQgdHlwZT0idGV4dCIgY2xhc3M9ImZvcm0tY29udHJvbCIgaWQ9Im5hbWUiCisgICAgICAgICAg
ICAgICAgICAgcmVxdWlyZWQKKyAgICAgICAgICAgICAgICAgICBbKG5nTW9kZWwpXT0ibW9kZWwu
bmFtZSIgbmFtZT0ibmFtZSIKKyAgICAgICAgICAgICAgICAgICAjbmFtZT0ibmdNb2RlbCI + Cisg
ICAgICAgICAgICA8ZGl2IFtoaWRkZW5dPSJuYW1lLnZhbGlkIHx8IG5hbWUucHJpc3RpbmUiCisg
ICAgICAgICAgICAgICAgIGNsYXNzPSJhbGVydCBhbGVydC1kYW5nZXIiPgorICAgICAgICAgICAg
ICBOYW1lIGlzIHJlcXVpcmVkCisgICAgICAgICAgICA8L2Rpdj4KKyAgICAgICAgICA8L2Rpdj4K
KyAgICAgCisgICAgICAgICAgPGRpdiBjbGFzcz0iZm9ybS1ncm91cCI + CisgICAgICAgICAgICA8
bGFiZWwgZm9yPSJhbHRlckVnbyI + QWx0ZXIgRWdvPC9sYWJlbD4KKyAgICAgICAgICAgIDxpbnB1
dCB0eXBlPSJ0ZXh0IiBjbGFzcz0iZm9ybS1jb250cm9sIiBpZD0iYWx0ZXJFZ28iCisgICAgICAg
ICAgICAgICAgICAgWyhuZ01vZGVsKV09Im1vZGVsLmFsdGVyRWdvIiBuYW1lPSJhbHRlckVnbyI +
CisgICAgICAgICAgPC9kaXY + CisgICAgIAorICAgICAgICAgIDxkaXYgY2xhc3M9ImZvcm0tZ3Jv
dXAiPgorICAgICAgICAgICAgPGxhYmVsIGZvcj0icG93ZXIiPkhlcm8gUG93ZXI8L2xhYmVsPgor
ICAgICAgICAgICAgPHNlbGVjdCBjbGFzcz0iZm9ybS1jb250cm9sIiBpZD0icG93ZXIiCisgICAg
ICAgICAgICAgICAgICAgIHJlcXVpcmVkCisgICAgICAgICAgICAgICAgICAgIFsobmdNb2RlbCld
PSJtb2RlbC5wb3dlciIgbmFtZT0icG93ZXIiCisgICAgICAgICAgICAgICAgICAgICNwb3dlcj0i
bmdNb2RlbCI + CisgICAgICAgICAgICAgIDxvcHRpb24gKm5nRm9yPSJsZXQgcG93IG9mIHBvd2Vy
cyIgW3ZhbHVlXT0icG93Ij57e3Bvd319PC9vcHRpb24 + CisgICAgICAgICAgICA8L3NlbGVjdD4K
KyAgICAgICAgICAgIDxkaXYgW2hpZGRlbl09InBvd2VyLnZhbGlkIHx8IHBvd2VyLnByaXN0aW5l
IiBjbGFzcz0iYWxlcnQgYWxlcnQtZGFuZ2VyIj4KKyAgICAgICAgICAgICAgUG93ZXIgaXMgcmVx
dWlyZWQKKyAgICAgICAgICAgIDwvZGl2PgorICAgICAgICAgIDwvZGl2PgorICAgICAKKyAgICAg
ICAgICA8YnV0dG9uIHR5cGU9InN1Ym1pdCIgY2xhc3M9ImJ0biBidG4tc3VjY2VzcyIgW2Rpc2Fi
bGVkXT0iIWhlcm9Gb3JtLmZvcm0udmFsaWQiPlN1Ym1pdDwvYnV0dG9uPgorICAgICAgICAgIDxi
dXR0b24gdHlwZT0iYnV0dG9uIiBjbGFzcz0iYnRuIGJ0bi1kZWZhdWx0IiAoY2xpY2spPSJuZXdI
ZXJvKCk7IGhlcm9Gb3JtLnJlc2V0KCkiPk5ldyBIZXJvPC9idXR0b24 + CisgICAgICAgIDwvZm9y
bT4KKyAgICAgIDwvZGl2PgorICAgICAKKyAgICAgIDxkaXYgW2hpZGRlbl09IiFzdWJtaXR0ZWQi
PgorICAgICAgICA8aDI + WW91IHN1Ym1pdHRlZCB0aGUgZm9sbG93aW5nOjwvaDI + CisgICAgICAg
IDxkaXYgY2xhc3M9InJvdyI + CisgICAgICAgICAgPGRpdiBjbGFzcz0iY29sLXhzLTMiPk5hbWU8
L2Rpdj4KKyAgICAgICAgICA8ZGl2IGNsYXNzPSJjb2wteHMtOSAgcHVsbC1sZWZ0Ij57eyBtb2Rl
bC5uYW1lIH19PC9kaXY + CisgICAgICAgIDwvZGl2PgorICAgICAgICA8ZGl2IGNsYXNzPSJyb3ci
PgorICAgICAgICAgIDxkaXYgY2xhc3M9ImNvbC14cy0zIj5BbHRlciBFZ288L2Rpdj4KKyAgICAg
ICAgICA8ZGl2IGNsYXNzPSJjb2wteHMtOSBwdWxsLWxlZnQiPnt7IG1vZGVsLmFsdGVyRWdvIH19
PC9kaXY + CisgICAgICAgIDwvZGl2PgorICAgICAgICA8ZGl2IGNsYXNzPSJyb3ciPgorICAgICAg
ICAgIDxkaXYgY2xhc3M9ImNvbC14cy0zIj5Qb3dlcjwvZGl2PgorICAgICAgICAgIDxkaXYgY2xh
c3M9ImNvbC14cy05IHB1bGwtbGVmdCI + e3sgbW9kZWwucG93ZXIgfX08L2Rpdj4KKyAgICAgICAg
PC9kaXY + CisgICAgICAgIDxicj4KKyAgICAgICAgPGJ1dHRvbiBjbGFzcz0iYnRuIGJ0bi1wcmlt
YXJ5IiAoY2xpY2spPSJzdWJtaXR0ZWQ9ZmFsc2UiPkVkaXQ8L2J1dHRvbj4KKyAgICAgIDwvZGl2
PgorICAgIDwvZGl2PgpcIE5vIG5ld2xpbmUgYXQgZW5kIG9mIGZpbGUKZGlmZiAtLWdpdCBhL3Ny
Yy9hcHAvaGVyby1mb3JtLmNvbXBvbmVudC50cyBiL3NyYy9hcHAvaGVyby1mb3JtLmNvbXBvbmVu
dC50cwpuZXcgZmlsZSBtb2RlIDEwMDY0NAppbmRleCAwMDAwMDAwLi45MjY1ZmI5Ci0tLSAvZGV2
L251bGwKKysrIGIvc3JjL2FwcC9oZXJvLWZvcm0uY29tcG9uZW50LnRzCkBAIC0wLDAgKzEsMjEg
QEAKK2ltcG9ydCB7IENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnOworCitpbXBvcnQg
eyBIZXJvIH0gZnJvbSAnLi9oZXJvJzsKKworQENvbXBvbmVudCh7CisJc2VsZWN0b3I6ICdhcHAt
aGVyby1mb3JtJywKKwl0ZW1wbGF0ZVVybDogJy4vaGVyby1mb3JtLmNvbXBvbmVudC5odG1sJwor
fSkKK2V4cG9ydCBjbGFzcyBIZXJvRm9ybUNvbXBvbmVudCB7CisKKwlwdWJsaWMgcG93ZXJzID0g
WydSZWFsbHkgU21hcnQnLCAnU3VwZXIgRmxleGlibGUnLCAnU3VwZXIgSG90JywgJ1dlYXRoZXIg
Q2hhbmdlciddOworCXB1YmxpYyBtb2RlbCA9IG5ldyBIZXJvKDE4LCAnRHIgSVEnLCB0aGlzLnBv
d2Vyc1swXSwgJ0NodWNrIE92ZXJzdHJlZXQnKTsKKworCXB1YmxpYyBzdWJtaXR0ZWQgPSBmYWxz
ZTsKKworCXB1YmxpYyBvblN1Ym1pdCgpIHsgdGhpcy5zdWJtaXR0ZWQgPSB0cnVlOyB9CisKKwlw
dWJsaWMgbmV3SGVybygpIHsKKwkJdGhpcy5tb2RlbCA9IG5ldyBIZXJvKDQyLCAnJywgJycpOwor
CX0KK30KZGlmZiAtLWdpdCBhL3NyYy9hcHAvaGVyby50cyBiL3NyYy9hcHAvaGVyby50cwpuZXcg
ZmlsZSBtb2RlIDEwMDY0NAppbmRleCAwMDAwMDAwLi4xNzQ5YzkyCi0tLSAvZGV2L251bGwKKysr
IGIvc3JjL2FwcC9oZXJvLnRzCkBAIC0wLDAgKzEsOSBAQAorZXhwb3J0IGNsYXNzIEhlcm8gewor
CWNvbnN0cnVjdG9yKAorCQlwdWJsaWMgaWQ6IG51bWJlciwKKwkJcHVibGljIG5hbWU6IHN0cmlu
ZywKKwkJcHVibGljIHBvd2VyOiBzdHJpbmcsCisJCXB1YmxpYyBhbHRlckVnbz86IHN0cmluZwor
CSkgeworCX0KK30KLS0gCjIuMTMuNgoK

Ich stehe vor einem ähnlichen Problem. Es scheint, dass das Plugin nur Variablen erkennt, die direkt in der Klasse deklariert sind, nicht jedoch diejenigen, die unter formGroup oder formBuilder verschachtelt sind.
Dieser Komponentencode gibt Fehler-Squigglies in HTML für die beiden FromControl-Felder aus.

export class MyDetailComponent implements OnInit {
  myForm: FormGroup;
  constructor() { }
  ngOnInit() {
    this.myForm = new FormGroup({
      name: new FormControl({ value: '', disabled: true }),
      gender: new FormControl({ value: '', disabled: true })
    });
  }
}

Dies führt andererseits nicht zu den Fehler-Squigglies, da ich FormControl direkt in der Klasse deklariert habe (dies ist leider keine Lösung, da Angular keine Formcontrol-Deklaration außerhalb der Formulargruppe zulässt).

export class MyDetailComponent implements OnInit {
  myForm: FormGroup;
  name: FormControl;
  gender: FormControl;
  constructor() { }
  ngOnInit() {
    this.myForm = new FormGroup({
      name: new FormControl({ value: '', disabled: true }),
      gender: new FormControl({ value: '', disabled: true })
    });
  }
}

Versuchen Sie, "!!" voranzustellen.
Obwohl es schwierig ist,
Das ist mir gelungen.

image

@hlovdal Ich habe deine Repro-Schritte ausprobiert, aber ich konnte den Fehler nicht erzeugen. Es scheint gut zu funktionieren.
Ich habe mit VS Code Linux v1.20.1, Typescript 2.6.2, Angular.ng-template v0.1.9 getestet
Können Sie bitte bestätigen, ob das Problem in Angular.ng-template v0.1.9 noch besteht?

@kyliau Ich bin heute mit VS Code v1.21.1 unter Windows, Typescript 2.3.4 und Angular.ng-template v0.1.9 auf dieses Problem gestoßen. So erstelle ich das Formular:

this.form = formBuilder.group({
      amount: ["", Validators.compose([Validators.required, SomeCustomValidator.isValid])],
      sale: [{ value: "0" }],
      amountTotal: [""],
      price: [{ value: "123" }, Validators.compose([Validators.required, SomeCustomValidator.isValid])],
      discount: [{ value: "0" }, SomeCustomValidator.isValid],
      priceAfterDiscount: [""],
      sum: [""],
      sumDph: [""]
 });

und in der Vorlage versuche ich so danach zu greifen:

<ion-item [class.invalid]="!buyForm.controls.amount.valid && (buyForm.controls.amount.dirty || submitAttempt)">

diesen Fehler bekommen:

[Angular] Identifier 'amount' is not defined. '__type' does not contain such a member

Wenn es negiert wird, wird der Fehler nicht ausgelöst (was bedeutet, dass nur buyForm.controls.amount.dirty unterstrichen ist, nicht der Teil !buyForm.controls.amount.valid ). Deshalb funktioniert die oben angegebene Lösung (mit doppelter Negation).

Ich habe seit Ewigkeiten nach einer Problemumgehung gesucht - danke

@guhyeon danke aber kannst du erklären was das macht?

@rubenheymans
Nun ... ich weiß nicht so viel.
Ich denke, es ist ein Typ-Skript-Compiler-Problem.
Es ist ein Hilfsmittel, das ich zufällig gelernt habe.

Ich habe stattdessen versucht, diese Problemumgehung zu verwenden, wodurch auch verhindert wird, dass sich der vscode Angular Language Service beschwert:

password.hasError('required') mit Validators.required Validator für das Passwort FormControl

AbstractControl.hasError() erfordert einen errorCode-Wert, den ich erhalten habe, indem ich die Eigenschaft AbstractControl.errors zum Debuggen auf dem Bildschirm angezeigt habe

{{password.errors | json}} , was zu Folgendem führt: { "required": true }

Weitere Typisierungen könnten wahrscheinlich für bekannte errorCodes sowie für benutzerdefinierte Validatoren verfügbar sein

image

Ich bekomme auch das gleiche Problem mit dem Typoskript-Compiler.

image
image
Gleich wie @ ajaysake1992

Ich denke, unter der Haube ist dies das gleiche Problem wie bei # 149 - das Referenzieren eines Objekts mit einer Indexsignatur nach Index ( control?.errors['required'] ) funktioniert, aber das Referenzieren mit Punktnotation ( control?.errors.required ) ist falsch als falsch markiert.

Ich habe das heute mit einem einfachen bekommen wo 'Suche' undefiniert war und mir rote Schnörkel gab.
Die App wurde wie beabsichtigt kompiliert und funktioniert (zu meiner Frustration, nachdem ich den halben Tag damit verbracht hatte, das Problem zu lösen, bevor ich es ausführte ...)
Klingt für mich nach einem Vscode-Fehler?

Hier ist meine Workaround-Lösung, wenn Ihnen das "!!" auf HTML.

your.component.ts:

get emailFormControl (): any {
return this.formGroupName.get ('email');
}}

your.component.html:

Bitte geben Sie eine gültige Email-Adresse ein.

Diese Lösung funktioniert bei mir, ohne dass ein Kompilierungs- / Laufzeitfehler auftritt.

Das hat bei mir funktioniert:
In der Zeile, in der Sie den Fehler markieren, habe ich vor dem Schließen des Tags (>) ein Leerzeichen mit der Leertaste gesetzt, und der Fehler ist verschwunden.
Ich habe den erstellten Speicherplatz gelöscht und alles war normal, ohne Fehler.

Auch genau das gleiche Problem. In FormBuilder erstellte FormGroup-Steuerelemente sind dem Intellisense des VSCode für die Ansichtsvorlage nicht bekannt. Irgendeine Idee, ob es eine tatsächliche Lösung dafür gibt, anstatt die !! Problemumgehung

Sie können anstelle des Punktoperators eine eckige Klammer verwenden, um auf den Eigenschaftsnamen zuzugreifen. Dies könnte Ihren Kompilierungsfehler beheben.
Beispiel - * ngIf = "price.errors [erforderlich]"

Wow, Klammern lösen das Rot. Ich kann bestätigen, dass dies sporatisch ist.
Ich verwende Angular: 7.2.15 , typescript: 3.1.6 und VSC 1.35.1 .
Screen Shot 2019-06-29 at 10 28 28 AM

Dies geschieht immer noch mit Angular 8.1.3, sowohl mit benutzerdefinierten als auch mit integrierten Formularvalidatoren (z. B. erforderlich). Wäre großartig, wenn die registrierten Validatoren für Intellisense klar wären. Ausführen von VSC 1.36.1.

Problemumgehung: Verwenden Sie anstelle von Punktanmerkungen eine Klammeranmerkung oder !! formcontrol.errors.required

Die Problemumgehung lässt mich überlegen, ob Intellisense es aufgrund seines undefinierten Werts markieren könnte. Da das Fehlerobjekt keine Menge von Wahr / Falsch-Flags ist, sondern durch das Vorhandensein dieser Flags definiert ist (was IMO ein ungewöhnliches Muster ist), könnte ich mir vorstellen, dass Intellisense Probleme damit hat.

@ivanwonder hat bereits PR für dieses Problem erstellt. Warten wir also, bis sie es zusammenführen.

Problemumgehung:

Statt:

formGroup.errors?.customValidator

benutzen:

formGroup.errors && formGroup.errors['customValidator']

Ich bin froh, dass es eine Problemumgehung gibt ... aber wurden bei der Untersuchung des Problems Fortschritte erzielt?
Ich bin sicher, dass viele von uns die einfache Punktnotation bevorzugen.

Dieses Problem besteht weiterhin in Version 0.802.3

Dieses Problem wurde aufgrund von Inaktivität automatisch gesperrt.
Bitte reichen Sie ein neues Problem ein, wenn Sie auf ein ähnliches oder verwandtes Problem stoßen.

Lesen Sie mehr über unsere Richtlinien zum automatischen Sperren von Konversationen .

_Diese Aktion wurde automatisch von einem Bot ausgeführt._

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen