首页 > 解决方案 > Angular 6 导入 JQVMap - 类型“JQuery”上不存在属性“vectorMap”'

问题描述

我正在尝试将可点击的地图、JQVMap和 JQuery 导入到我的 Angular 6 项目中,但我遇到了一些初期问题。

例外:错误 TS2339:“JQuery”类型上不存在属性“vectorMap”。

我的组件:

import {AfterViewInit, Component} from '@angular/core';
import * as jQuery from 'jquery';

@Component({
selector: 'app-example',
templateUrl: './explore.component.html'
})

export class ExampleComponent implements AfterViewInit {

ngAfterViewInit() {
jQuery('#vmap').vectorMap(
  {
    map: 'world_en',
    backgroundColor: '#a5bfdd',
    borderColor: '#818181',
    borderOpacity: 0.25,
    borderWidth: 1,
    color: '#f4f3f0',
    enableZoom: true,
    hoverColor: '#c9dfaf',
    hoverOpacity: null,
    normalizeFunction: 'linear',
    scaleColors: ['#b6d6ff', '#005ace'],
    selectedColor: '#c9dfaf',
    selectedRegions: null,
    showTooltip: true
    });
   }

  }

我已经通过 npm 和 assets 目录中的必要 JVQMap 脚本安装了 JQuery。JQuery 似乎工作正常。

角.json

 "scripts": ["./node_modules/jquery/dist/jquery.min.js",
          "./node_modules/bootstrap/dist/js/bootstrap.js",
          "./src/assets/js/jquery.vmap.js",
          "./src/assets/js/jquery.vmap.world.js"]
      },

如果这是一个微不足道或愚蠢的错误,我们深表歉意。我一般是 Angular 和 JS 的新手

标签: jqueryangularangular6jqvmapexternal-js

解决方案


用这个

import { Component, OnInit } from '@angular/core';

declare const jQuery: any;

推荐阅读