external JavaScript File not working in angular 2
Question
I am building a web app with Angular 2 framework and I want to use an external template. Trying to convert it into an angular2 SPA.
I need to run some scripts (custom.js). All CSS and JavaScript file are added in Index.html.
Everything is working fine except external js. JavaScripts are not working properly. But the CSS files are working. Material components and modals other JavaScript functionality nothing is working inside angular component file.
3 answers
solution1
0 2017-12-19 09:56:26
In your .angular-cli.json file you need to add the external js file under your app's scripts property.
{
// other app config
apps:[
{
// Your app config
"scripts":[
"path/to/your/custom.js"
]
}
]
}
If you would like to use the script in a component, you should declare it before the component class.
declare var customLibraryName: any;
See the Angular Cli Wiki for more details.
solution2
0 2017-12-23 08:14:25
thanks @JosephDragovich for your fast reply. To be honest, I am a fresher in Javascript and angular 2. Following your suggestion, I updated my code as below: javaScript not working
angular-cli.json
"scripts": [
"./src/assets/Js/jquery-2.2.4.min.js",
"./src/assets/Js/bootstrap.min.js",
"./src/assets/Js/jquery-ui.min.js",
"./src/assets/Js/jquery-plugin-collection.js",
"./src/assets/Js/custom.js"
],
my index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>LocumMedApp</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
</head>
<body class="has-side-panel side-panel-right fullwidth-page side-push-panel">
<app-root></app-root>
</body>
</html>
solution3
0 2019-01-22 05:28:00
也可以使用<script>标记将脚本放置在index.html中。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.