如何在 Ionic 2 typescript 应用程序上使用没有类型定义的 javascript 库？

Question

我正在尝试在我的 ionic 2 typescript 应用程序上使用 Jquery Bracket 库。但是，该库没有类型定义。因此，我尝试以传统方式使用它。我将库的 js 和 CSS 文件放入我的 src/assets 文件夹中，并将必要的标签添加到我的 src/index.html 文件中。最后，我在我的打字稿文件中声明了一个变量，并尝试按照图书馆网站上的示例中的建议使用它。

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import * as $ from 'jquery'

declare var Options: any;

    @Component({
      selector: 'page-tournament-schedule',
      templateUrl: 'tournament-schedule.html'
    })
    export class TournamentSchedulePage {

      constructor(public navCtrl: NavController) {
      }

      ionViewDidLoad() {
        console.log('Hello TournamentSchedule Page');
        this.getBrackets();
      }

      getBrackets() {
        var singleElimination = {
          "teams": [              // Matchups
            ["Team 1", "Team 2"], // First match
            ["Team 3", "Team 4"]  // Second match
          ],
          "results": [            // List of brackets (single elimination, so only one bracket)
            [                     // List of rounds in bracket
              [                   // First round in this bracket
                [1, 2],           // Team 1 vs Team 2
                [3, 4]            // Team 3 vs Team 4
              ],
              [                   // Second (final) round in single elimination bracket
                [5, 6],           // Match for first place
                [7, 8]            // Match for 3rd place
              ]
            ]
          ]
        }
        $('.demo').Options.bracket({
          init: singleElimination
        });
      }
    }

但是，它给了我以下错误

无法读取未定义的属性“括号”

Answer 1

试试下面的。 创建一个 ts 文件，将其命名为 customTyping.d.ts 或类似名称，添加以下内容，

    interface JQuery {
      brackets?: any;
    }

然后将该文件包含在 tsconfig.json 中

"include": [
    "...",
    "...",
    "pathto/customTypings.d.ts"
  ]

这样您将在 JQuery 中定义括号的类型。让我知道这是否有帮助。