0

I tried to add script.js to angular.json and use it in one component. That's not working. Those who suggest to add script tag to my html file thats not a good idea. Can someone suggest another idea or what I missed to make my script work?

I add my js file called script.js on angular.json

 "scripts": [
          "src/assets/js/script.js"
        ]

And I declare a variable in slider.ts

  declare const owlCarousel: any;
  ngOnInit() {
    owlCarousel();
  }

script.js

$('.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
        }
    }
    });
James Z
  • 12,209
  • 10
  • 24
  • 44
Kindth
  • 337
  • 1
  • 8
  • 30

1 Answers1

1

Try this

First add function in your script.js

export function owlCarousel() {
    $('.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
        }
    }
    });
}

And in your component add this line to import function owlCarousel 

 import {owlCarousel} from '../../assets/js/script.js' /plz add correct path

Notice that slider.ts is not mandatory

Hope useful.

A.khalifa
  • 2,366
  • 3
  • 27
  • 40
  • 1
    Why the slider.ts is not mandatory !! I tried to make the script as a function to call it but still doesn't work – Kindth Aug 17 '20 at 21:39
  • 1
    yeah I did & I tried sample test window.alert('hello!') but js not working I don't know why – Kindth Aug 18 '20 at 12:47