Owl Carousel 2 不适用于 Angular 5答案

【问题标题】：Owl Carousel 2 is not working with Angular 5Owl Carousel 2 不适用于 Angular 5
【发布时间】：2018-07-04 06:51:28
【问题描述】：

我需要将 OwlCarousel2 与 Angular5 一起使用，我正在使用 https://www.npmjs.com/package/ngx-owl-carousel，但它的显示错误请参见下图以供参考。任何帮助将不胜感激。

【问题讨论】：

让我们试试我的答案，如果仍然有错误，请告诉我
你试过了吗。我的回答。发生了什么？
否 @KarnanMuthukumar 它仍然显示相同的错误。我已按照所有步骤操作，但仍然无法理解问题所在。
还是同样的错误？好的，请稍等，我会为您制作一些 OwlCarousel2。
给那个 OwlCarousel2 链接你用过什么？

标签： angular5 owl-carousel-2

【解决方案1】：

从您的屏幕截图来看，这不是猫头鹰轮播问题。它发生在您的应用组件文件中未包含 jquery。

所以使用以下命令安装

npm install jquery — save

在 .angular.json 文件中添加 jquery 文件

“scripts”: [ “../node_modules/jquery/dist/jquery.min.js” ]

然后在app.component.ts文件中导入如下。

import * as $ from ‘jquery’;

那么现在你可以使用errors了。

注意：-

如果您想在您的应用程序中使用引导程序，或者如果您已经在您的项目中使用，请确保在包含引导程序 javascript 文件之前包含 jQuery，如下所示。由于 bootstrap 的 javascript 文件需要 jQuery。

“scripts”: [ “../node_modules/jquery/dist/jquery.min.js”,
“../node_modules/bootstrap/dist/js/bootstrap.js”]

参考链接：- https://googleweblight.com/i?u=https://medium.com/@swarnakishore/how-to-include-and-use-jquery-in-angular-cli-project-592e0fe63176&hl=en-IN

https://googleweblight.com/i?u=https://stackoverflow.com/questions/43934727/how-to-use-jquery-plugin-with-angular-4&hl=en-IN

这两个链接提供了一些在您的应用中导入 jquery 的想法。

请尝试一次，然后告诉我。

希望它能解决你的问题。

【讨论】：

【解决方案2】：

请运行以下命令并检查以下文件以获取 Owl 轮播滑块。

npm install script-loader
npm install ngx-owl-carousel --save

https://drive.google.com/open?id=1zi1zTX4rks-es1lZsE0bcfmnoYtjygIp
https://drive.google.com/open?id=1qarsnGqYL_P6ryYNh3mLm4ClUqkchxhv
https://drive.google.com/open?id=1or-6D-PGzW-NCFRiMykG4YnF2Mto33kc
https://drive.google.com/open?id=1QcYILCD_eByrF8r70-vERNgeAImkQT6i

【讨论】：

我使用的是 angular cli，所以我不需要脚本加载器，我只是通过 angular.json 添加了文件，如果你有在 angular 5 中工作的代码，你能通过 git hub ot stackblitz 提供吗？