web-dev-qa-db-fra.com

Comment importer un fichier JS en angulaire 6?

comment puis-je importer un fichier js dans angular 6. J'ai essayé d'implémenter une barre de navigation et il contient des fonctions js . merci !!!

J'ajoute mon fichier js appelé nav.js

 "scripts": [
          "src/assets/js/nav.js"
        ]
1
George

Vous devriez inclure sur index.html, par exemple: 

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
   <title>A random project</title>
   <base href="/">

   <meta name="viewport" content="width=device-width, initial- 
    scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
   <link rel="stylesheet" href="https://cartodb- 
  libs.global.ssl.fastly.net/cartodb.js/v3/3.15/themes/css/cartodb.css" 
/>
<script src="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/cartodb.core.js"></script>

<app-root></app-root>
</body>
</html>

Dans ce cas, j'ai inclus la bibliothèque cartodb.js, puis pour utiliser cartodb.js sur tout composant ou service que j'utilise:

declare var cartodb: any;

Au début de tout fichier (composant, service, etc.).

Note change cartodb par le nom de la bibliothèque que vous utiliserez, par exemple pour jquery:

declare var jquery:any;
declare var $ :any;

Vous devriez avoir quelque chose comme ça:

import { Injectable } from '@angular/core';
// Other imports...

declare var cartodb: any;
@Injectable()
export class ARandomService {
}

P.s Recherchez si le code que vous souhaitez utiliser n'existe pas dans npm.

3
LuaXD

Angular 6 a un emplacement dédié pour déclarer des fichiers js Dans les tableaux dédiés de votre angular.json, Sous 

 /projects/$(youProjectName)/architect/build/options/scripts[]

et 

 /projects/$(youProjectName)/architect/test/options/scripts[]

Par exemple: 

npm install fast-levenshtein --save

va installer une bibliothèque js sous node-modules

Le chemin relatif au projet du fichier js lib est déclaré comme suit:

"scripts": [
   "node_modules/fast-levenshtein/levenshtein.js"
]

Ensuite, déclarez dans votre composant la ou les variables à utiliser, soit comme décrit dans la documentation npm, soit par @LuaXD. 

0
user1767316