Javascript 在Angular web应用程序中导入外部JS文件不起作用_Javascript_Angular_File

Javascript 在Angular web应用程序中导入外部JS文件不起作用

javascript angular file

Javascript 在Angular web应用程序中导入外部JS文件不起作用,javascript,angular,file,Javascript,Angular,File,我只想在我的web应用程序中使用外部js文件。我不想改变更多的代码。但导入后，我运行应用程序并出现以下错误： TypeError: Cannot read property 'fn' of undefined at owl.carousel.min.js:1 at owl.carousel.min.js:1 我的HTML文件如下所示： <html> <body> </body> <script src="https://ajax.go

我只想在我的web应用程序中使用外部js文件。我不想改变更多的代码。但导入后，我运行应用程序并出现以下错误：

TypeError: Cannot read property 'fn' of undefined
    at owl.carousel.min.js:1
    at owl.carousel.min.js:1

我的HTML文件如下所示：

<html>
<body>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="src/app/components/landing-page/js/owl.carousel.min.js"></script>
<script src="src/app/components/landing-page/js/cbpAnimatedHeader.js"></script>
<script src="src/app/components/landing-page/js/theme-scripts.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="src/app/components/landing-page/js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="src/app/components/landing-page/js/imageComparisonSlider.js"></script>
<script type="module" src="src/app/components/landing-page/js/bootstrap.min.js"></script>
<script>
  /*Execute a function that will execute an image compare function for each element with the img-comp-overlay class:*/
  initComparisons();
</script>

</html>

我不知道，导入外部js是否正确？其次，在本例中，如何使用来自外部js文件的函数initcomparations（）this function

也许有人有什么想法

致以最良好的祝愿

狮子座是一个非常相似的问题。我尝试过这种方法，但没有成功

<html>
<body>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="src/app/components/landing-page/js/owl.carousel.min.js"></script>
<script src="src/app/components/landing-page/js/cbpAnimatedHeader.js"></script>
<script src="src/app/components/landing-page/js/theme-scripts.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="src/app/components/landing-page/js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="src/app/components/landing-page/js/imageComparisonSlider.js"></script>
<script type="module" src="src/app/components/landing-page/js/bootstrap.min.js"></script>
<script>
  /*Execute a function that will execute an image compare function for each element with the img-comp-overlay class:*/
  initComparisons();
</script>

</html>

$(window).scroll(function () {
  if ($(document).scrollTop() > 150) {
    $('.navbar').addClass('navbar-shrink');
  }
  else {
    $('.navbar').removeClass('navbar-shrink');
  }
});

$(function () {
  $('a[href*="#"]:not([href="#"])').click(function () {
    if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

// Owl carousel
$('.owl-carousel').owlCarousel({
  loop: true,
  margin: 10,
  nav: false,
  autoplay: true,
  autoplayTimeout: 3000,
  autoplayHoverPause: true,
  dots: false,
  responsive: {
    0: {
      items: 1
    },
    600: {
      items: 3
    },
    1000: {
      items: 5
    }
  }
})

// hide #back-top first
$("#back-top").hide();

// fade in #back-top

$(window).scroll(function () {
  if ($(this).scrollTop() > 100) {
    $('#back-top').fadeIn();
  } else {
    $('#back-top').fadeOut();
  }
});

// scroll body to 0px on click
$('#back-top a').on("click", function () {
  $('body,html').animate({
    scrollTop: 0
  }, 800);
  return false;
});

// Closes the Responsive Menu on Menu Item Click
$('.navbar-collapse ul li a').click(function () {
  $('.navbar-toggle:visible').click();
});