Как добавить сторонний плагин jquery на angular 7? - PullRequest
0 голосов
/ 03 апреля 2019

Привет! Я пытался добавить сторонний плагин jquery в свое приложение Angular 7. До сих пор я сделал: добавил в angular.json расположение таких файлов:

"scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "src/assets/js/ticker/jquery.easy-ticker.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
 ]

В моем AppComponent:

declare var $: any; interface JQuery { easyTicker(options?: any):
JQuery; }

Попробуйте выполнить:

 ngAfterViewInit() {

    $('.ultimasExecucoes').easyTicker({
      visible: 1,
      interval: 4000
    });
}

В моем шаблоне

<div class="ultimasExecucoes">
            <ul>
            <li *ngFor="let workFlow of execucoesEncerradas"> 
                {{workFlow.nomeWorkFlow}} - Data Início: {{workFlow.dataInicioWf | date : 'dd/MM/yyyy HH:mm:ss'}} 
                - Data Encerramento: {{workFlow.dataEncerramentoWf | date : 'dd/MM/yyyy HH:mm:ss'}} 
                - Resultado: {{workFlow.resultadoExecucao}}
            </li>
            </ul>
        </div>

Но на моей странице ничего не происходит. Как я могу добавить плагин jquery?

1 Ответ

0 голосов
/ 12 апреля 2019

Привет, прочитав много статей о типах jquery, я решил эту проблему следующим образом:

  1. Сначала необходимо установить jquery / types: npm install --save @ types / jquery
  2. Внутри директории node_modules / @ types я создал папку "easyticker" (имя плагина)
  3. В директорию "easyticker" я создал файл: index.d.ts внутри Я поместил это:

объявить модуль 'easyTicker'

интерфейс JQuery {easyTicker (параметры ?: любой): JQuery;}

На моем компоненте я импортировал jquery:

import * как jQuery из 'jquery'

Затем я позвонил своему плагину:

ngAfterViewInit () {

  /* JqueryEasyTicker */
  (<any>$)( document ).ready(function() {
      (<any>$)('#ultimasExecucoes').easyTicker({
        visible: 1,
        interval: 8000
      });
  });   
 }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...