Hogyan kifejezetten meg egy új tulajdonság `window` géppel?

Annak érdekében, hogy ez a dinamikus, csak használja:

(<any>window).MyNamespace

Vagy...

egyszerűen beírhatja:

window['MyNamespace']

és akkor nem kap egy fordítási hiba, és ez ugyanúgy működik, mint a gépelés window.MyNamespace

Használata TSX? Semmilyen más válaszokat nekem dolgozik.

Itt van, amit tettem:

(window as any).MyNamespace

Az elfogadott válasz, amit szoktam használni, de géppel 0.9. * Ez már nem működik. Az új meghatározás a Windowfelületet úgy tűnik, hogy teljesen a beépített meghatározás helyett bővítésére is.

Vettem, hogy ezt helyette:

interface MyWindow extends Window {
    myFunction(): void;
}

declare var window: MyWindow;

UPDATE: A géppel 0.9.5 Az elfogadott válasz ismét működik.

Ha kell kiterjeszteni a windowtárgy egy egyedi típus, amely előírja, hogy a használata importakkor a következő módszert:

window.d.ts

import MyInterface from './MyInterface';

declare global {
    interface Window {
        propName: MyInterface
    }
}

Lásd: „Global Pontosságnövelés” a „Nyilatkozat egyesítése” című részében olvashatunk: https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation

Global vannak „rossz” :), azt hiszem, a legjobb módja annak, hogy még a hordozhatóság:

Először exportálja a felületet: (pl: ./custom.window.ts)

export interface CustomWindow extends Window {
    customAttribute: any;
}

Második importál

import {CustomWindow} from './custom.window.ts';

Harmadik leadott globális var ablak CustomWindow

declare let window: CustomWindow;

Ily módon nincs is piros vonal különböző IDE, ha használja a létező attribútumok ablak objektumot, így a végén próbát:

window.customAttribute = 'works';
window.location.href = '/works';

Tesztelték géppel 2.4.x

Itt van, hogyan kell csinálni, ha használja géppel Definition menedzser !

npm install typings --global

létrehozása typings/custom/window.d.ts:

interface Window {
  MyNamespace: any;
}

declare var window: Window;

Telepítse az egyéni gépelés:

typings install file:typings/custom/window.d.ts --save --global

Kész, használd ! Géppel nem fog panaszkodni többé:

window.MyNamespace = window.MyNamespace || {};

Nem kell, hogy ezt nagyon gyakran az egyetlen eset volt már, amikor a Redux Devtools a middleware.

Egyszerűen nem:

const composeEnhancers = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

Vagy meg tudná csinálni:

let myWindow = window as any;

és akkor myWindow.myProp = 'my value';

A többi válasz nem tökéletes.

• Némelyikük csak elnyomják a típusú következtetés az üzletben.
• Néhány a többiek csak törődik globális változót névtér, de nem olyan felület / osztály

Azt is találkozik a hasonló probléma ma reggel. Próbáltam sok „megoldások” SO, de egyikük sem nem termelnek típus hiba abszolút és lehetővé kiváltó típusa ugrás IDE (webstorm vagy vscode).

Végül innen

https://github.com/Microsoft/TypeScript/issues/3180#issuecomment-102523512

, Találok egy ésszerű megoldás tulajdonítanak tipizálását globális változó, amely egyfajta interface / osztály és névtér egyaránt .

Példa az alábbi:

// typings.d.ts
declare interface Window {
    myNamespace?: MyNamespace & typeof MyNamespace
}

declare interface MyNamespace {
    somemethod?()
}

declare namespace MyNamespace {
    // ...
}

Most, a fenti kódot egyesíti tipizálását névtér MyNamespaceés interfész MyNamespacea globális változó myNamespace(tulajdonát ablakban).

Ha a Szög CLI ez tényleg egyszerű (tesztelt CLI RC.0):

src / polyfills.ts

declare global {
  interface Window {
    myCustomFn: () => void;
  }
}

én-custom-utils.ts

window.myCustomFn = function () {
  ...
};

Én a IntelliJ, így én is szükséges, hogy a következő beállításokat az IDE, mielőtt az új polyfills felvette:

> File 
> Settings 
> Languages & Frameworks 
> TypeScript 
> check 'Use TypeScript Service'.

Azok számára, akik szeretnék beállítani számított vagy dinamikus tulajdonság a windowtárgyat, úgy fogja találni, hogy nem lehetséges a declare globalmódszerrel. Annak tisztázása, erre a célra az esetben

window[DynamicObject.key] // Element implicitly has an 'any' type because type Window has no index signature

Lehet, hogy próbálja meg ilyesmit

declare global {
  interface Window {
    [DyanmicObject.key]: string; // error RIP
  }
}

A fenti hiba ellenére. Ez azért van, mert a géppel, interfészek nem játszik jól kiszámított tulajdonságokkal fog dobni egy ehhez hasonló hibát

A computed property name in an interface must directly refer to a built-in symbol

Hogy ezt elkerüld, akkor megy a sugallják a casting window, hogy <any>így meg tudod csinálni

(window as any)[DynamicObject.key]

Készíts egy egyedi felületet kiterjeszti az ablakot, és az egyéni tulajdon kötelező.

Ezután hagyja, hogy a customWindow használó egyedi felület, de értékes az eredeti ablakot.

Ez működött a typescript@3.1.3.

interface ICustomWindow extends Window {
  MyNamespace?: any
}

const customWindow:ICustomWindow = window;

customWindow.MyNamespace = customWindow.MyNamespace {} 

Akartam használni ezt egy szögletes (6) könyvtár ma, és ez elvitt egy darabig, hogy ezt a munkát, mint várták.

Annak érdekében, hogy az én könyvtárat használja nyilatkozatokat kellett használni a d.tskiterjesztése a fájl, hogy kijelenti, az új ingatlan a globális objektumot.

Így a végén, a fájl végződött valami ilyesmit:

/path-to-angular-workspace/angular-workspace/projects/angular-library/src/globals.d.ts

A létrehozott ne felejtsük el, hogy ki ez a public_api.ts.

Ez hatott rám. Remélem ez segít.

Referenciaként (ez a helyes választ!):

Belül egy .d.tsdefiníciós fájl

type MyGlobalFunctionType = (name: string) => void

Ha a munka a böngészőt, akkor add tagjai a böngésző ablak keretében újra megnyitja ablak felülete:

interface Window {
  myGlobalFunction: MyGlobalFunctionType
}

Ugyanaz ötlet NodeJS:

declare module NodeJS {
  interface Global {
    myGlobalFunction: MyGlobalFunctionType
  }
}

Most nyilvánítja a gyökér változó (hogy valóban él ablak vagy globális)

declare const myGlobalFunction: MyGlobalFunctionType;

Ezután egy szabályos .tsfájl, de importált mellékhatása, hogy tényleg végrehajtja:

global/* or window */.myGlobalFunction = function (name: string) {
  console.log("Hey !", name);
};

És végre használni máshol a codebase, vagy:

global/* or window */.myGlobalFunction("Kevin");

myGlobalFunction("Kevin");

Ha ön használ géppel 3.x, akkor lehet, hogy kihagyja a declare globalrészt a másik választ, és inkább csak használ:

interface Window {
  someValue: string
  another: boolean
}

Ez velem dolgozott ha géppel 3.3 WebPack és TSLint.

Typscript nem végez typecheck string tulajdonságait.

window["newProperty"] = customObj;

Ideális esetben a globális változó forgatókönyvet kell kerülni. ÉN használ ez néha debug egy tárgy böngésző konzolban.

Először meg kell, hogy állapítsa meg a window objektum jelenlegi hatálya alá.
Mivel géppel szeretné tudni, hogy milyen típusú objektum.
Mivel ablak objektum meghatározott máshol nem lehet újra azt.
De akkor nyilvánítja a következők: -

declare var window: any;

Ez nem újra az ablak objektum, vagy nem fog létrehozni egy másik változó nevét window.
Ez azt jelenti, ablak határozza valahol máshol, és csak most hivatkozva azt jelenlegi hatályát.

Akkor nézze meg a MyNamespace objektum egyszerűen: -

window.MyNamespace

És most a géppel nem fog panaszkodni.

Miután választ találni körül, azt hiszem, ez az oldal hasznos lehet. https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation Nem biztos, hogy a történelem nyilatkozat összefonódó, de ez megmagyarázza, hogy miért, a következő működhet.

declare global {
    interface Window { MyNamespace: any; }
}

window.MyNamespace = window.MyNamespace || {};