javascript - TypeScript: IFrame sandbox-egenskap är undefined, DOMSettableTokenList har ingen konstruktor

Jag skapar ett iFrame-element i TypeScript:

var iFrameElement : HTMLIFrameElement = document.createElement("iframe");
iFrameElement.sandbox.add('allow-forms');
iFrameElement.sandbox.add('allow-scripts'); 
iFrameElement.sandbox.add('allow-same-origin');

Men sandbox-egenskapen är odefinierad, så add(value: string) här misslyckas.

Jag kan inte heller lista ut hur man instansierar sandbox-egenskapen, här är gränssnittet som definierats i lib.d.ts:

interface HTMLIFrameElement {
    sandbox: DOMSettableTokenList;
}
interface DOMSettableTokenList extends DOMTokenList {
    value: string;
}
interface DOMTokenList {
    length: number;
    contains(token: string): boolean;
    remove(token: string): void;
    toggle(token: string): boolean;
    add(token: string): void;
    item(index: number): string;
    [index: number]: string;
    toString(): string;
}

Jag tror att det bara är någon syntax jag inte vet hur man använder här, eller att det finns någon annan trick för att få detta att fungera. Jag sökte omfattande på den här sidan och på internet i stort, men resultaten var inte särskilt användbara.

Svaret här fungerar tyvärr inte i TypeScript (Typ 'String' saknar egenskapen 'value' från typen 'DOMSettableTokenList'), vilket får mig att vilja kasta ett objekt till den typen. Jag ser att den här personen verkar ha implementerat om typen, men det verkar för hackigt för mig just nu.

Hjälp mig Stack Overflow, du är mitt enda hopp.

Svar #1

Generellt, om du försöker klura ut vissa webbläsarspecifika implementationer, skulle jag föreslå att du kastar (byter typ) till any, så du kan skriva även:

(<any>iFrameElement).foo = "";

... men gör lite fångst i din kod.

Detta kommer att tillåta dig att använda detta för IE:

iFrameElement.sandbox.add('allow-forms');
iFrameElement.sandbox.add('allow-scripts');

Och detta för Chrome:

(<any>iFrameElement).sandbox = "allow-forms allow-scripts";

Relaterade artiklar