Question

我有以下打字稿代码：

 private addBrowserNameAsCssClassToHtmlTag(): void {
  var rootElement = angular.element(document.querySelector("html"));
  if (this.isOpera()) {
    rootElement.addClass("opera-browser");
  } else if (this.isFirefox()) {
    rootElement.addClass("firefox-browser");
  } else if (this.isSafari()) {
    rootElement.addClass("safari-browser");
  } else if (this.isIE()) {
    rootElement.addClass("ie-browser");
  } else if (this.isChrome()) {
    rootElement.addClass("chrome-browser");
  }
}

private isOpera(): boolean {
  return (!!(<any>window).opr && !!(<any>opr).addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
}

private isFirefox(): boolean {
  //noinspection TypeScriptUnresolvedVariable
  return typeof InstallTrigger !== 'undefined';
}

private isSafari(): boolean {
  return /constructor/i.test(window.HTMLElement) || ((p): boolean => {
      return p.toString() === "[object SafariRemoteNotification]";
    })(!window['safari'] || safari.pushNotification);
}

private isIE(): boolean {
  return /*@cc_on!@*/false || !!window.document.documentMode;
}

private isChrome(): boolean {
  return !!window.chrome && !!window.chrome.webstore;
}

代码工作正常，但问题是它会产生编译时错误：

error TS2304: Cannot find name 'opr'.
error TS2339: Property 'opera' does not exist on type 'Window'.
error TS2304: Cannot find name 'InstallTrigger'.
error TS2339: Property 'HTMLElement' does not exist on type 'Window'.
error TS2304: Cannot find name 'safari'.
error TS2339: Property 'documentMode' does not exist on type 'Document'.
error TS2339: Property 'chrome' does not exist on type 'Window'.
error TS2339: Property 'chrome' does not exist on type 'Window'.

如果我用简单的javascript编写，我就不会有任何问题。如何抑制有关此部分代码的编译器警告？或者也许有更好的解决方案，我不知道？

Answer 1

解决方案：

declare const InstallTrigger: any;

class Abc {
    private addBrowserNameAsCssClassToHtmlTag(): void {
        var rootElement = angular.element(document.querySelector("html"));
        if (this.isOpera()) {
            rootElement.addClass("opera-browser");
        } else if (this.isFirefox()) {
            rootElement.addClass("firefox-browser");
        } else if (this.isSafari()) {
            rootElement.addClass("safari-browser");
        } else if (this.isIE()) {
            rootElement.addClass("ie-browser");
        } else if (this.isChrome()) {
            rootElement.addClass("chrome-browser");
        }
    }

    private isOpera(): boolean {
        return (!!window['opr'] && !!window['opr'].addons) || !!window['opera'] || navigator.userAgent.indexOf(' OPR/') >= 0;
    }

    private isFirefox(): boolean {
        //noinspection TypeScriptUnresolvedVariable
        return typeof InstallTrigger !== 'undefined';
    }

    private isSafari(): boolean {
        return /constructor/i.test(window['HTMLElement']) || ((p): boolean => {
            return p.toString() === "[object SafariRemoteNotification]";
        })(!window['safari'] || window['safari'].pushNotification);
    }

    private isIE(): boolean {
        return /*@cc_on!@*/false || !!window.document['documentMode'];
    }

    private isChrome(): boolean {
        return !!window['chrome'] && !!window['chrome'].webstore;
    }
}

Answer 2

快速而肮脏的回答，使用括号表示法，它们未在TS中进行类型检查

interface Window {
    opera:string;   
}

interface Document {
    documentMode:string;   
}

另一种选择是扩展全局接口，当你构建typescript时，编译器包含一个“base”.d.ts文件，它们是lib.d.ts，或者如果将es6作为目标，它的lib.es6.d.ts.要扩展全局接口，请创建一个新的.d.ts文件。例如myGlobalExtentions.d.ts并将其包含在您的构建中。

getElementById

禁止打字稿警告

2 个答案: