utilisation de bibliothèques JS externes dans mon projet angular 2

Question

J'ai besoin d'utiliser cette bibliothèque JS dans mon projet angulaire 2

cette question peut faire double emploi avec la mienne, mais aucune réponse n'a fonctionné pour moi.

J'ai essayé d'inclure la bibliothèque comme balise script dans ma page index.html

Il ne le voit toujours pas http://localhost:8100/PrayTimes.js est n'existe pas

J'ai également écrit ce code ci-dessus

declare var PrayTimes:any;

J'ai essayé de l'utiliser dans mon constructeur, mais j'obtiens cette erreur

PrayTimes n'est pas défini

Answer 1

Si vous utilisez angular-cli, vous pouvez ajouter tous vos fichiers JS externes dans le dossier assets. Et ensuite dans angular-cli.json ajoutez-les :

"scripts": [
        "../node_modules/jquery/dist/jquery.min.js",
        "../node_modules/bootstrap/dist/js/bootstrap.min.js",
        "../node_modules/moment/moment.js",
        "../node_modules/chart.js/dist/Chart.bundle.min.js",
        "../node_modules/chart.js/dist/Chart.min.js",
        "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker.min.js",
        "./assets/js/slimscroll.min.js",
        "./assets/js/inspinia.js",
        "./assets/js/metisMenu.js",
        "./assets/js/footable.all.min.js"
      ]

Vous pouvez également le faire avec des styles externes :

"styles": [
        "../node_modules/ng2-toastr/bundles/ng2-toastr.min.css",
        "../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss",
        "../node_modules/font-awesome/scss/font-awesome.scss",
        "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker3.min.css",
        "./assets/scss/plugins/footable/footable.core.css",
        "./assets/scss/style.scss"
      ]

Et bien sûr, vous avez raison, alors vous devez ajouter dans typings.d.ts :

declare var PrayTimes:any;
declare var System: any;
declare var $: any;
declare var moment: any;
declare var Chart: any;

Answer 2

Placez tous les javascript, css externes, images etc. dans src/assets

(sera compilé en build/assets )

Dans votre index.html : <script src="assets/yourJavascript.js"></script>

Ensuite, vous pouvez l'utiliser comme vous le décrivez. ( declare var PrayTimes: any; )