कैसे आप स्पष्ट रूप से टाइपप्रति में `window` पर एक नई प्रॉपर्टी सेट करूँ?

यह गतिशील रहने के लिए, का उपयोग करें:

(<any>window).MyNamespace

या ...

तुम सिर्फ टाइप कर सकते हैं:

window['MyNamespace']

और आप अभ्यस्त एक संकलन त्रुटि मिलती है और यह टाइपिंग के रूप में ही काम करता है window.MyNamespace

TSX ले रहे हैं? अन्य उत्तर में से कोई भी मेरे लिए काम कर रहे थे।

यहाँ मैं क्या किया है:

(window as any).MyNamespace

स्वीकार किए जाते हैं जवाब है कि मैं क्या उपयोग करने के लिए है, लेकिन टाइपप्रति 0.9 के साथ प्रयोग किया है। * यह अब काम करता है। की नई परिभाषा Windowइंटरफ़ेस पूरी तरह से बजाय इसे बढ़ाने की, निर्मित परिभाषा को बदलने के लिए लगता है।

मैं बजाय ऐसा करने के लिए ले लिया है:

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

declare var window: MyWindow;

अद्यतन: टाइपप्रति 0.9.5 के साथ स्वीकार किए जाते हैं जवाब फिर से काम कर रहा है।

आप का विस्तार करने की जरूरत है windowकि के उपयोग की आवश्यकता के लिए एक कस्टम प्रकार के साथ वस्तु importआप निम्न विधि का उपयोग कर सकते हैं:

window.d.ts

import MyInterface from './MyInterface';

declare global {
    interface Window {
        propName: MyInterface
    }
}

पुस्तिका के 'घोषणा विलय' खंड में 'वैश्विक विस्तार' देखें: https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation

वैश्विक कर रहे हैं "" बुराई :), मुझे लगता है कि यह भी पोर्टेबिलिटी के लिए सबसे अच्छा तरीका है:

सबसे पहले आप इंटरफ़ेस निर्यात: (जैसे: ./custom.window.ts)

export interface CustomWindow extends Window {
    customAttribute: any;
}

दूसरा आप आयात

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

तीसरा CustomWindow के साथ वैश्विक वर खिड़की डाली

declare let window: CustomWindow;

इस तरह आप अलग आईडीई में भी लाल रेखा अगर तुम अंत कोशिश में खिड़की वस्तु के बराबर विशेषताओं के साथ उपयोग करते हैं, तो नहीं है:

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

टाइपप्रति 2.4.x के साथ परीक्षण किया गया

यहाँ यह कैसे करना है, तो आप उपयोग कर रहे हैं है टाइपप्रति परिभाषा प्रबंधक !

npm install typings --global

बनाएं typings/custom/window.d.ts:

interface Window {
  MyNamespace: any;
}

declare var window: Window;

अपने कस्टम टाइपिंग स्थापित करें:

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

हो गया, इसका इस्तेमाल ! टाइपप्रति अब शिकायत नहीं होगा:

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

मैं इस बहुत बार केवल मामले मैं था पड़ा है जब मिडलवेयर साथ Redux DevTools का उपयोग कर ऐसा करने के लिए, की जरूरत नहीं है।

मैं बस किया था:

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

या आप कर सकता है:

let myWindow = window as any;

और फिर myWindow.myProp = 'my value';

अन्य उत्तर के अधिकांश सही नहीं कर रहे हैं।

• उनमें से कुछ बस दुकान के लिए प्रकार निष्कर्ष को दबाने।
• दूसरों से कुछ केवल नाम स्थान के रूप में वैश्विक चर के बारे में परवाह है, लेकिन नहीं के रूप में इंटरफ़ेस / वर्ग

मैं भी आज सुबह समान समस्या का सामना। मैं इतने पर इतने सारे "समाधान" की कोशिश की, लेकिन उनमें से कोई नहीं प्रकार की त्रुटि बिल्कुल उत्पादन और आईडीई (webstorm या vscode) में टाइप कूद ट्रिगर सक्षम करें।

अंत में, यहाँ से

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

, मैं करने के लिए एक उचित समाधान खोजने के वैश्विक चर जो इंटरफेस / वर्ग और नाम स्थान दोनों के रूप में कार्य के लिए typings देते हैं ।

उदाहरण के नीचे है:

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

declare interface MyNamespace {
    somemethod?()
}

declare namespace MyNamespace {
    // ...
}

अब, कोड ऊपर नाम स्थान का typings विलीन हो जाती है MyNamespaceऔर इंटरफ़ेस MyNamespaceवैश्विक चर में myNamespace(खिड़की की संपत्ति)।

आप उपयोग कर रहे हैं कोणीय CLI यह वास्तव में सीधा है (CLI RC.0 पर परीक्षण):

src / polyfills.ts

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

मेरी-कस्टम utils.ts

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

मैं IntelliJ उपयोग कर रहा हूँ, इसलिए मैं भी IDE में निम्न सेटिंग बदलने के लिए मेरी नई polyfills उठाया से पहले की जरूरत:

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

जो लोग पर एक गणना या गतिशील गुण सेट के लिए windowवस्तु, आप के साथ यह संभव नहीं मिल जाएगा declare globalविधि। उपयोग के इस मामले को स्पष्ट करने के

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

आप इस तरह कुछ करने के लिए प्रयास कर सकते हैं

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

ऊपर हालांकि त्रुटि होगा। इसका कारण यह है टाइपप्रति में, इंटरफेस अभिकलन गुणों के साथ अच्छी तरह से नहीं खेलते हैं और इस तरह एक त्रुटि फेंक जाएगा

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

इस के आसपास पाने के लिए आपको कास्टिंग के सुझाव है साथ जा सकते हैं windowकरने के लिए <any>तो आप क्या कर सकते हैं

(window as any)[DynamicObject.key]

एक कस्टम इंटरफ़ेस विंडो फैली करें और वैकल्पिक के रूप में अपने कस्टम गुण जोड़ें।

फिर, customWindow कि कस्टम इंटरफ़ेस का उपयोग करते हैं, लेकिन मूल खिड़की के साथ मूल्यवान।

यह typescript@3.1.3 के साथ काम किया है।

interface ICustomWindow extends Window {
  MyNamespace?: any
}

const customWindow:ICustomWindow = window;

customWindow.MyNamespace = customWindow.MyNamespace {} 

मैं एक कोणीय (6) पुस्तकालय में आज इस उपयोग करना चाहता था और यह मेरे कुछ समय लिया इस अपेक्षा के अनुरूप काम करने के लिए मिलता है।

घोषणाओं का उपयोग करने के लिए अपने पुस्तकालय के लिए आदेश में मैं का इस्तेमाल किया था d.tsफ़ाइल है कि वैश्विक वस्तु के नए गुणों की घोषणा के लिए विस्तार।

तो अंत में, फ़ाइल की तरह कुछ के साथ समाप्त हो गया:

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

बन जाने के बाद अपने में यह पर्दाफाश करने के लिए मत भूलना public_api.ts।

वो मेरे लिए किया गया। उम्मीद है की यह मदद करेगा।

संदर्भ के लिए (यह सही जवाब है):

एक के अंदर .d.tsपरिभाषा फ़ाइल

type MyGlobalFunctionType = (name: string) => void

आप ब्राउज़र में काम करते हैं, आप विंडो के इंटरफ़ेस फिर से खोलने से ब्राउज़र की खिड़की संदर्भ में सदस्यों को जोड़ने:

interface Window {
  myGlobalFunction: MyGlobalFunctionType
}

NodeJS के लिए एक ही विचार:

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

अब आप रूट चर (है कि वास्तव में खिड़की या वैश्विक पर रहेंगे) की घोषणा

declare const myGlobalFunction: MyGlobalFunctionType;

फिर एक नियमित में .tsफ़ाइल है, लेकिन पक्ष प्रभाव के रूप में आयात, आप वास्तव में इसे लागू:

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

और अंत में, codebase में कहीं और इसका इस्तेमाल किसी के साथ:

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

myGlobalFunction("Kevin");

आप टाइपप्रति 3.x का उपयोग कर रहे हैं, तो आप छोड़ करने में सक्षम हो सकता है declare globalअन्य उत्तर में भाग है और इसके बजाय सिर्फ का उपयोग करें:

interface Window {
  someValue: string
  another: boolean
}

जब टाइपप्रति 3.3, Webpack और TSLint का उपयोग कर यह मैं के साथ काम किया।

Typscript स्ट्रिंग गुणों पर typecheck प्रदर्शन नहीं करता।

window["newProperty"] = customObj;

आदर्श रूप में, वैश्विक चर परिदृश्य से बचा जाना चाहिए। मैं यह कभी कभी का उपयोग ब्राउज़र कंसोल में एक वस्तु डिबग करने के लिए।

सबसे पहले आप वर्तमान क्षेत्र में खिड़की वस्तु की घोषणा करने की जरूरत है।
क्योंकि टाइपप्रति वस्तु के प्रकार जानना चाहूंगा।
चूंकि विंडो ऑब्जेक्ट कहीं और परिभाषित किया गया है तो आप इसे फिर से परिभाषित नहीं कर सकते।
इस प्रकार लेकिन आप इसे घोषणा कर सकते हैं: -

declare var window: any;

इस विंडो वस्तु को फिर से परिभाषित नहीं होंगे या यदि उसमें नाम के साथ एक और चर नहीं बनाएगा window।
इसका मतलब यह है खिड़की कहीं और परिभाषित किया गया है और तुम सिर्फ वर्तमान क्षेत्र में यह संदर्भित कर रहे हैं।

तो फिर तुम बस द्वारा अपने MyNamespace वस्तु का उल्लेख कर सकते हैं: -

window.MyNamespace

और अब टाइपप्रति शिकायत नहीं होंगे।

जवाब के आसपास खोजने के बाद, मुझे लगता है कि यह पेज उपयोगी हो सकता है। https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation घोषणा विलय के इतिहास के बारे में सुनिश्चित नहीं हैं, लेकिन यह बताता है कि क्यों निम्नलिखित काम कर सकता था।

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

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