Получение ссылочной ошибки jQuery после добавления jQuery DateTimePicker (не официально) в угловой проект

Question

В моем угловом проекте, когда я не добавил jQuery DateTimePicker Очистить jQuery DateTimePicker

jQuery отлично работал с моим угловым проектом. Вот как я определил это в моем проекте.

lib.ts

declare var jQuery: any;

window['jQuery'] = require('jquery');
window['$'] = window['jQuery'];

и использование его в любом компоненте, подобном этому

account.component.ts

import { Component, AfterViewInit } from '@angular/core'

declare var $ : any;

@Component({
    selector: 'app-account',
    templateUrl: './account.component.html',
    styleUrls: ['./account.component.css']
})

export class AccountComponent implements AfterViewInit {

constructor(){
}

ngAfterViewInit(){
    $(".submitBtn").click(() => {
        $(this).css("color", "red");
    });
}

}

И я не получаю никакой ошибки на консоли. Но когда я добавил jQuery DateTimePicker (ссылка выше) в свой проект.

package.json

"dependencies": {
  // Other Dependencies //

  "jquery-datetimepicker": "^2.5.20",

  // Other Dependencies //
}

определил его в сценарии как часть angular-cli.json

"styles": [
        "styles.css",
        "../node_modules/jquery-datetimepicker/build/jquery.datetimepicker.min.css"
      ],
 "scripts": [
        "../node_modules/jquery-datetimepicker/build/jquery.datetimepicker.full.js",
      ],

Это начало давать мне ошибку на консоли.

Uncaught ReferenceError: jQuery is not defined
    at scripts.bundle.js:2661
    at scripts.bundle.js:2663

В моем шаблоне jQuery DateTimePicker работает абсолютно нормально, когда мы делаем

$('#demo').datetimepicker({inline:true,});

Но эта ошибка ссылки все еще присутствует на моей консоли, она появляется всякий раз, когда я нажимаю обновить или изменить что-либо внутри IDE.

Answer 1

Это вам поможет:

1) Установите плагин Jquery для угловых

npm install jquery --save

2) Теперь в вашем app.module.ts добавьте

import * as $ from "jquery"