web-dev-qa-db-fra.com

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

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

cette question peut être dupliquée avec moi, mais aucune réponse n'a fonctionné pour moi

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

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

aussi j'ai é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

javascriptangulartypescriptionic2ionic3
29
Ahmed Mohsen

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

(sera compilé pour build/assets)

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

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

45
Ivar Reukers

Si vous utilisez angular-cli, vous pouvez ajouter tous vos fichiers JS externes dans le dossier assets. Et puis 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 le faire aussi 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 in typings.d.ts:

declare var PrayTimes:any;
declare var System: any;
declare var $: any;
declare var moment: any;
declare var Chart: any;
56
Korotkikh Mikhail