首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >将js组件导入Angular 5

将js组件导入Angular 5
EN

Stack Overflow用户
提问于 2018-06-02 03:40:43
回答 1查看 312关注 0票数 4

我是Angular的新手,还在努力学习这项技术。我有一个Angular 5应用程序,我想在其中使用JS组件。这可能是一个更一般的问题,但这里是我的细节。

设置: VS代码,Angular 5组件:http://seiyria.com/bootstrap-slider/

我使用npm install bootstrap-slider安装了它。我可以看到node_modules文件夹中的文件。

我在angular-cli.json文件中包含了CSS和JS文件:

代码语言:javascript
复制
  "styles": [
    "../node_modules/bootstrap-slider/dist/css/bootstrap-slider.min.css"
  ],
  "scripts": [
    "../node_modules/bootstrap-slider/dist/bootstrap-slider.min.js"
  ],

我可以在我的component.html中使用HTML标记:

代码语言:javascript
复制
 <input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/>

当我将JS代码段放到component.ts文件中时,我得到一个错误。

代码语言:javascript
复制
    var slider = new Slider('#ex1', {
  formatter: function(value) {
    return 'Current value: ' + value;
  }
});

错误:找不到名称“Slider”。

我认为我不需要使用import语句,而且根据我的研究,看起来不应该在component.html文件中包含JS或CSS。

如有任何帮助,我们不胜感激!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-06-02 04:53:51

在组件中添加Slider为:

代码语言:javascript
复制
import { Component } from '@angular/core';
...
declare var Slider: any;
...
@Component({
...

更新1:

index.html中添加js为:

代码语言:javascript
复制
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/10.0.2/bootstrap-slider.min.js"></script>
</head>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50650087

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档