Ich versuche, eine Typoskript-Map zu durchlaufen, erhalte jedoch immer wieder Fehler und konnte noch keine Lösung für ein so triviales Problem finden.
Mein Code lautet:
myMap : Map<string, boolean>;
for(let key of myMap.keys()) {
console.log(key);
}
Und ich bekomme den Fehler:
Der Typ 'IterableIteratorShim <[string, boolean]>' ist kein Array-Typ oder String-Typ.
Full Stack Trace:
Error: Typescript found the following errors:
/home/project/tmp/broccoli_type_script_compiler-input_base_path-q4GtzHgb.tmp/0/src/app/project/project-data.service.ts (21, 20): Type 'IterableIteratorShim<[string, boolean]>' is not an array type or a string type.
at BroccoliTypeScriptCompiler._doIncrementalBuild (/home/project/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:115:19)
at BroccoliTypeScriptCompiler.build (/home/project/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:43:10)
at /home/project/node_modules/broccoli-caching-writer/index.js:152:21
at lib$rsvp$$internal$$tryCatch (/home/project/node_modules/rsvp/dist/rsvp.js:1036:16)
at lib$rsvp$$internal$$invokeCallback (/home/project/node_modules/rsvp/dist/rsvp.js:1048:17)
at lib$rsvp$$internal$$publish (/home/project/node_modules/rsvp/dist/rsvp.js:1019:11)
at lib$rsvp$asap$$flush (/home/project/node_modules/rsvp/dist/rsvp.js:1198:9)
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickCallback (internal/process/next_tick.js:98:9)
Ich verwende Angular-Cli Beta5 und Typoskript 1.8.10 und mein Ziel ist es5. Hat jemand dieses Problem gehabt?
typescript
iterator
maps
mwe
quelle
quelle
Antworten:
Sie könnten
Map.prototype.forEach((value, key, map) => void, thisArg?) : void
stattdessen verwendenVerwenden Sie es so:
quelle
.forEach
ist nicht optimal, da man es nicht brechen kann, AFAIKArray.prototype.map
.Verwenden Sie einfach die
Array.from()
Methode, um es in eine zu konvertierenArray
:quelle
<any>
-Cast der Karte mit für-of iterieren.Array.from()
hier vorgeschlagene Strategie hat bei mir funktioniert.es6
es5
quelle
Mit Array.from , Array.prototype.forEach () und Pfeil - Funktionen :
Über die Tasten iterieren :
Iterieren Sie über die Werte :
Durchlaufen Sie die Einträge :
quelle
Das hat bei mir funktioniert. TypeScript-Version: 2.8.3
quelle
target
Intsconfig
ist,es5
dies einen Fehler auslöst, aber mites6
funktioniert richtig. Sie können auch nurfor (const [key, value] of myMap)
beim Zielen tunes6
Gemäß den Versionshinweisen zu TypeScript 2.3 zu "Neu
--downlevelIteration
" :Dies ist standardmäßig nicht aktiviert! Fügen Sie
"downlevelIteration": true
Ihr Flag hinzutsconfig.json
oder übergeben Sie es--downlevelIteration
antsc
, um vollständige Iterator-Unterstützung zu erhalten.Wenn dies vorhanden ist, können Sie schreiben
for (let keyval of myMap) {...}
undkeyval
der Typ wird automatisch abgeleitet.Warum ist dies standardmäßig deaktiviert? Nach Typoskript Beitrag @aluanhaddad ,
Wenn Sie auf ES2015 (
"target": "es2015"
intsconfig.json
odertsc --target ES2015
) oder höherdownlevelIteration
abzielen können, ist das Aktivieren ein Kinderspiel. Wenn Sie jedoch auf ES5 / ES3 abzielen, können Sie einen Benchmark durchführen, um sicherzustellen, dass die Iteratorunterstützung die Leistung nicht beeinträchtigt (wenn dies der Fall ist, sind Sie möglicherweise besser aus mitArray.from
KonvertierungforEach
oder einer anderen Problemumgehung).quelle
Das hat bei mir funktioniert.
quelle
Ich verwende den neuesten TS und Knoten (v2.6 bzw. v8.9) und kann Folgendes tun:
quelle
"downlevelIteration": true
Ihre einstellen musstentsconfig.json
?downlevelIteraton
gesetzt, mein Ziel istes2017
jedoch.Type 'Map<K, V>' is not an array type or a string type.
Sie können die Array-Map-Methode auch auf die iterable Map.entries () anwenden:
Wie in anderen Antworten erwähnt, müssen Sie möglicherweise die Iteration auf niedriger Ebene in Ihrer Datei tsconfig.json aktivieren (unter Compileroptionen):
quelle
const projected = Array.from(myMap).map(...);
Nur eine einfache Erklärung, um es in einem HTML-Dokument zu verwenden.
Wenn Sie eine Karte mit Typen (Schlüssel, Array) haben, initialisieren Sie das Array folgendermaßen:
Und um darüber zu iterieren, erstellen Sie ein Array aus Schlüsselwerten.
Verwenden Sie es einfach als Array wie in:
Dann können Sie in HTML Folgendes verwenden:
Innerhalb dieser Schleife erhalten Sie nur den Array-Wert mit:
Getan!
quelle
In Typescript 3.5 und Angular 8 LTS musste der Typ wie folgt umgewandelt werden:
quelle
Wenn Sie verschachtelte Funktionen nicht wirklich mögen, können Sie auch über die Tasten iterieren:
Beachten Sie, dass Sie die Nicht-Schlüssel-Iterationen mit herausfiltern
hasOwnProperty
müssen. Wenn Sie dies nicht tun, erhalten Sie eine Warnung oder einen Fehler.quelle