Как импортировать файлы javascript в определенный компонент, такой как HTML или CSS?

Question

`

<script src="./jquery.min.js"></script>
  <script src="./bootstrap.bundle.min.js"></script>

  <!-- Core plugin JavaScript-->
  <script src="./jquery.easing.min.js"></script>

  <!-- Page level plugin JavaScript-->
  <script src="./Chart.min.js"></script>
  <script src="./jquery.dataTables.js"></script>
  <script src="./dataTables.bootstrap4.js"></script>

  <!-- Custom scripts for all pages-->
  <script src="./sb-admin.min.js"></script>

  <!-- Demo scripts for this page-->
  <script src="./datatables-demo.js"></script>
  <script src="./chart-area-demo.js"></script>

Это некоторая часть кода моего файла index.html в угловом компоненте. Я хочу импортировать все js-файлы, как указано выше, но не смог этого сделать. Может кто-нибудь сказать, как я могу включить все javascripts файл? Я только хочу включить его в Html-файл углового компонента. Я не могу сделать это глобально, так как я должен использовать его только в конкретном компоненте

Answer 1

Скрипты и стили должны быть импортированы в ваш файл angular.json: -

найдите следующую строку и импортируйте ваши CSS и JS в них: -

"styles": [
    "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
    "./node_modules/font-awesome/css/font-awesome.min.css",
    "./node_modules/semantic-ui/dist/semantic.min.css",
    "src/styles.scss"
],
"scripts": []

Answer 2

Позвольте мне взять, например, Jquery. Предположим, что путь Jquery включен в файл index.html, как вы делали это выше, а затем в компонент, где я хочу использовать Jquery, добавьте ниже код кода над декоратором @Component, затем вы можете используйте функциональность Jquery только внутри этого компонента.

declare var $;

Пример component.ts

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

//declare dollor($) here
declare var $;
@Component({ templateUrl: 'home.component.html' })
export class HomeComponent {
    public divElement: any;
    constructor( ) { }

    ngOnInit() {
     this.divElement = $('div');
    }
}

Answer 3

Эти теги скрипта принадлежат только этому компоненту?Если нет, как насчет размещения этих тегов в файле index.html?