错误TS2339:类型'JQuery'上不存在属性'modal'

Question

我正在使用带有AngularJS的Typescript.我使用jQuery库的类型定义的模态有问题.我收到以下错误:'错误TS2339:类型'JQuery'上不存在属性'模态'.

版本:jQuery库,版本1.10.x/2.0.x说明:https://github.com/borisyankov/DefinitelyTyped

码

$scope.delete = function (id) {
  Photo.get({id: id}, function(result) {
     $scope.photo = result;
     $('#deletePhotoConfirmation').modal('show');// error line 
  });
};

我引用到jquery.d.ts的angular.d.ts

<reference path="../jquery/jquery.d.ts" />

我的全球供应商参考文件如下所示:

<reference path='../vendor/types/angular/angular.d.ts' />
<reference path='../vendor/types/angular/angular-mocks.d.ts' />
<reference path='../vendor/types/jasmine/jasmine.d.ts' />

Answer 1

使用较新版本的打字稿(> v2我相信):

npm install -D @types/bootstrap

Answer 2

你的问题是缺乏属性与名称造成modal的jquery.d.ts文件.

如果你确定这个工作在纯JS中你可以像这样欺骗它

$scope.delete = function (id) {
  Photo.get({id: id}, function(result) {
     $scope.photo = result;
     (<any>$('#deletePhotoConfirmation')).modal('show');
  });
};

此外,您还可以找到d.ts已定义此选项的其他文件.

尝试考虑已经有选项的这个库modal

祝好运!

Answer 3

就我而言，我不得不使用

npm install -D @types/bootstrap

然后我必须导入引导程序

import * as bootstrap from 'bootstrap';

但最重要的步骤是删除 jquery

import * as $ from 'jquery';

否则会给我这个错误：

TypeError：$（...）。modal不是函数

Answer 4

这对我有用，我在第一行中添加：
declare var $ :any;
此声明$类型为any ，

Answer 5

我可以按如下方式解决：

import * as $ from "jquery";

($('#menuModal') as any).modal('toggle');

Answer 6

当我将 angular 升级到版本 9 时，我遇到了这个问题。

这是我的解决方案，我为关心的人分享。

'JQuery' 类型不存在属性 'modal'

$('#ManualMinMaxModal').modal('show');

改成

($('#ManualMinMaxModal') as any).modal('show');

和

“JQuery”类型上不存在属性“DataTable”

$('#realTimeTable').DataTable()

改成

($('#realTimeTable') as any).DataTable()

和

!$.fn.DataTable.isDataTable('#realTimeTable')

改成

!($.fn as any).DataTable.isDataTable('#realTimeTable')

更新：

强制转换到任何时候都不起作用，最后的解决方案是将声明从更改import * as $ from 'jquery'为declare var $: any;