Gépelt: casting HTML-elem

Mivel a géppel 0.9 a lib.d.tsfájlt, amely speciális túlterhelés aláírások vissza a megfelelő típusú hívások getElementsByTagName.

Ez azt jelenti, hogy már nem kell használni típus állításokat, hogy módosítsa a típus:

// No type assertions needed
var script: HTMLScriptElement = document.getElementsByTagName('script')[0];
alert(script.type);

Mindig csapkod típusú rendszer segítségével:

var script = (<HTMLScriptElement[]><any>document.getElementsByName(id))[0];

Ahhoz, hogy a végén:

• egy tényleges Arraytárgy (nem NodeListöltözött fel, mint egy Array)
• Egy lista, amely garantáltan csak olyan HTMLElements, nem Nodes erő-típuskonverziót HTMLElements
• egy meleg fuzzy érzés, hogy nem a helyes út

Próbáld ezt:

let nodeList : NodeList = document.getElementsByTagName('script');
let elementList : Array<HTMLElement> = [];

if (nodeList) {
    for (let i = 0; i < nodeList.length; i++) {
        let node : Node = nodeList[i];

        // Make sure it's really an Element
        if (node.nodeType == Node.ELEMENT_NODE) {
            elementList.push(node as HTMLElement);
        }
    }
}

Élvez.

Csak tisztázni, ez a helyes.

Nem lehet átalakítani „NodeList” -ről „HTMLScriptElement []”

mint NodeListnem egy tényleges array (pl nem tartalmaz .forEach, .slice, .pushstb ...).

Így ha mégis konvertálni HTMLScriptElement[]a típusú rendszer, azt nem kap típusú hiba, ha próbált hívni Array.prototypetagjai rajta fordításkor, de ez nem futási időben.

Ne írjon öntött. Soha. Használja típus őrök:

const e = document.getElementsByName("script")[0];
if (!(e instanceof HTMLScriptElement)) 
  throw new Error(`Expected e to be an HTMLScriptElement, was ${e && e.constructor && e.constructor.name || e}`);
// locally TypeScript now types e as an HTMLScriptElement, same as if you casted it.

Hagyja, hogy a fordító a munkát az Ön számára, és kap a hibák, amikor a feltételezések rossz irányba megy.

Úgy tűnhet, túlzás ebben az esetben, de ez segít sokat, ha jön vissza később, és változtassa meg a választó, mint a hozzá egy osztályt, ami hiányzik a dom, például.

Ez úgy tűnik, hogy megoldja a problémát, a [index: TYPE]tömb hozzáférés típusa, egészségére.

interface ScriptNodeList extends NodeList {
    [index: number]: HTMLScriptElement;
}

var script = ( <ScriptNodeList>document.getElementsByName('foo') )[0];

Frissítve példa:

const script: HTMLScriptElement = document.getElementsByName(id).item(0) as HTMLScriptElement;

Dokumentáció:

Géppel - Basic típusok - Type állításokat

Meg lehet oldani a nyilatkozat fájlt (lib.d.ts) ha géppel meghatározná HTMLCollection helyett NodeList mint egy visszatérő típus.

DOM4 is meghatározza ezt a helyes visszatérési típus, de a régebbi DOM specifikáció kevésbé egyértelmű.

Lásd még http://typescript.codeplex.com/workitem/252

Azt is javasoljuk a sitepen útmutatók

https://www.sitepen.com/blog/2013/12/31/definitive-guide-to-typescript/ (lásd alább) és https://www.sitepen.com/blog/2014/08/22/advanced -typescript-fogalmak-osztályok típusai /

Géppel is lehetővé teszi, hogy meghatározza a különböző típusú visszatérési ha a pontos szöveg van ellátva érvként a funkciót. Például géppel ambient nyilatkozat a Dom createElement módszer a következőképpen néz ki:

createElement(tagName: 'a'): HTMLAnchorElement;
createElement(tagName: 'abbr'): HTMLElement;
createElement(tagName: 'address'): HTMLElement;
createElement(tagName: 'area'): HTMLAreaElement;
// ... etc.
createElement(tagName: string): HTMLElement;

Ez azt jelenti, géppel, amikor hívja pl document.createElement ( „video”), géppel tudja a visszatérési érték egy HTMLVideoElement és képes lesz arra, hogy megbizonyosodjon róla, hogy kölcsönhatásba megfelelően a DOM Video API nélkül kell begépelnie érvényesíteni.

Mivel ez egy NodeList, nem Array, akkor nem igazán lehet konzollal vagy öntés Array. Az ingatlan módja annak, hogy az első csomópont:

document.getElementsByName(id).item(0)

Akkor csak öntött, hogy:

var script = <HTMLScriptElement> document.getElementsByName(id).item(0)

Vagy meghosszabbítja NodeList:

interface HTMLScriptElementNodeList extends NodeList
{
    item(index: number): HTMLScriptElement;
}
var scripts = <HTMLScriptElementNodeList> document.getElementsByName('script'),
    script = scripts.item(0);

var script = (<HTMLScriptElement[]><any>document.getElementsByName(id))[0];