将脚本js添加到Angular 9项目

时间:2020-08-07 14:23:58

标签: javascript angular typescript tags

我试图将script.js添加到angular.json并在一个组件中使用它,所以对于那些建议将脚本标签添加到我的html文件中的人来说不起作用,那不是一个好主意,所以有人可以提出另一个想法或是什么让我的脚本无法正常工作。谢谢

这是我的剧本:

$('.owl-carousel').owlCarousel({
loop:true,
margin:10,
dots:false,
nav:true,
mouseDrag:false,
autoplay:true,
animateOut: 'slideOutUp',
responsive:{
    0:{
        items:1
    },
    600:{
        items:1
    },
    1000:{
        items:1
    }
}
});

file.html:

<header>

  <div class="owl-carousel owl-theme">
      <div class="item">
          <img src="https://cdn.pixabay.com/photo/2017/10/24/10/30/business-2884023_960_720.jpg" alt="images not found">
          <div class="cover">
              <div class="container">
                  <div class="header-content">
                      <div class="line"></div>
                      <h2>Teimagine Digital Experience with</h2>
                      <h1>Start-ups and solutions</h1>
                      <h4>We help entrepreneurs, start-ups and enterprises shape their ideas into products</h4>
                  </div>
              </div>
           </div>
      </div>                    
      <div class="item">
          <img src="https://cdn.pixabay.com/photo/2016/03/09/09/22/workplace-1245776_960_720.jpg" alt="images not found">
          <div class="cover">
              <div class="container">
                  <div class="header-content">
                      <div class="line animated bounceInLeft"></div>
                      <h2>Reimagine Digital Experience with</h2>
                      <h1>Intelligent solutions</h1>
                      <h4>We help entrepreneurs, start-ups and enterprises shape their ideas into products</h4>
                  </div>
              </div>
           </div>
      </div>                
      
</header>

1 个答案:

答案 0 :(得分:1)

方法1:

  • 请参阅angular-cli.json(angular.json时的脚本 使用6+角文件。

    "scripts": [
        "../path" 
     ];
    

    然后添加types.d.ts(如果没有,则在src中创建此文件 已经存在)

    declare var variableName:any;
    

    将其导入文件中

    import * as variable from 'variableName';
    

参考https://stackoverflow.com/a/44817445/9640128

方法2:

  • 您可以在组件动态加载时添加多个脚本

参考:https://stackoverflow.com/a/49981918/9640128