Question

当我在TypeScript Angular6中使用jQuery时出现以下错误，请帮我

jQuery('#assignsp').modal('show');

遵循这些步骤

3个步骤：

安装jQuery。（如果已安装，则跳过）

npm install jquery --save 安装jQuery的类型。

npm install @ types / jquery --save

Import jQuery in app.module.ts.

import * as $ from 'jquery';

它向我显示错误

错误TS2339：类型'JQuery<HTMLElement>中不存在属性'modal'

错误TS2339：类型'JQuery'不存在属性'modal'。

Answer 1

您尝试同时执行多项操作。首先，您需要将jQuery与Typescript集成在一起，其次，集成引导程序模态功能，该功能最终会依赖jQuery。让我们先集成jQuery，然后跳转到引导程序。

jQuery安装：您已经在这里做了很多事情

npm install jquery --save

npm install @types/jquery --save

npm i bootstrap --save

角度配置：在此处输入jQuery和引导程序：

"styles":[
           "src/styles.css",
            "./node_modules/bootstrap/dist/css/bootstrap.min.css"
         ],
"scripts":[
            "./node_modules/jquery/dist/jquery.min.js",
             "./node_modules/bootstrap/dist/js/bootstrap.min.js"
           ]

打字稿配置：将此行添加到组件顶部。

/// <reference path ="../../node_modules/@types/jquery/index.d.ts"/>
declare var $: any 
ngOnInit() {
    $('#myModal').modal('show');
}

HTML：在此处添加模式代码

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">Modal</h4>
      </div>
      <div class="modal-body">
        Modal content
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

我已经尝试了上述方法，并且对我有用。让我知道您是否仍然遇到错误。

Answer 2

    import * as $AB from 'jquery';
        jQuery('#exampleModal').show();
   jQuery('#exampleModal').hide();

Answer 3

我遇到了同样的问题，我已经按照以下步骤进行了操作，并且解决了。

npm install -D @types/bootstrap --save

in your app.module.ts
import * as bootstrap from "bootstrap";
import * as $ from "jquery";

Angular6类型的“ JQuery”上不存在属性“ modal”

3 个答案: