在 Angular 5 项目中包含 jquery-ui

Question

我正在尝试将 jquery-ui 添加到我在 Angular 5 中的项目中，因为我必须使用 jquery-ui 创建一个功能，但我无法让它工作。我得到错误：

TypeError: WEBPACK_IMPORTED_MODULE_10_jquery(...).droppable 不是 一个函数

我尝试将 jquery-ui 脚本放入我的资产文件夹并将其加载到 index.html 中，但这不起作用，因为它在 jquery 之前加载。现在我用这段代码将它添加到我使用它的组件中，它在 jquery 之后添加它但仍然得到上面的错误：

if (!document.querySelector('script[src="./assets/js/jquery-ui.min.js"]')) {
      const s = document.createElement('script');
      s.type = 'text/javascript';
      s.src = './assets/js/jquery-ui.min.js';
      document.head.appendChild(s);
    }

当我运行 npm install jquery-ui 并将脚本添加到 angular-cli.json 时，会发生同样的错误...不知道还有什么可以尝试...

编辑：这个答案终于对我有用：Angular4 can't find Jquery-UI functions

Answer 1

您可以安装jquery-ui-dist 以避免将文件添加到您的索引文件中：

npm install jquery
npm install jquery-ui-dist

将此添加到script 内angular-cli.json

 "../node_modules/jquery/dist/jquery.min.js",
 "../node_modules/jquery-ui-dist/jquery-ui.js"