混合jQuery和Angular4

不同的方式我最近开始，希望学习角4把它捡起来的几个项目（我还在学习很多基础的，所以我的问题似乎是显而易见的）。在过去，我一直在使用jQuery来处理大多数DOM操作，但是现在使用Angular时，有非常明显的变化，这使得在Angular应用程序中使用jQuery更麻烦一些。混合jQuery和Angular4

我读了一个多角度的项目中使用jQuery对于很多堆栈溢出的职位，但是他们都建议从组件打字稿文件中写你的jQuery函数。这是有道理的，因为Angular应该基于组件。我唯一的问题是关于如何在组件之外创建全局级jQuery函数。

例如，在过去我一直就创建了一个js文件来保存我的jQuery的功能，并让他们我的HTML文件中引用。一个例子就是图像的视差函数。如果我想为不同的视差图像添加一些不同的样式，我可以做到这一点，并仍然有我的jQuery做它的工作，但现在说例如我有两个不同的视差组件使用相同的jQuery代码，是否有（右）的方式来引用从不同组件内的相同功能通过一个全球性的js文件，持有jQuery代码？

我的假设是，我可以只创建一个文件“xxxx.js”保存的功能，并将它index.html文件中引用。我只想知道我所描述的东西是否可行，如果是的话，最好的方法是什么。

来源

2017-07-27 Nic H

我将可能使用依赖注入，的做法是：

创建它包含所有跨职能的通用功能一个服务文件。
使用他们作为我的目标组件供应商。
使用扶养注射创建这类服务的对象，并在我的组件使用它们。

至于有办法“创建JS和包括index.html，然后整个组件使用”， 是有可能。我已经在我的项目中使用它作为外部库中的一个，这是一个js文件。步骤应该是：

复制在SRC /资产/ JavaScript的JS文件

（加入他们的index.html

<script src="assets/javascript/yourFile.js"></script>

声明你的js函数如图组件部分组件之前，指令）如下所示：
```
declare var yourFunction: any; 
```
现在您可以在目标组件中使用您的功能。

来源

2017-07-27 01:27:22

啊这样就解决了一半的问题。但现在说一个例子，我有一个函数被触发在一个特定的事件，如窗口调整大小。我的大多数功能都没有命名，因为它们只是触发了事件的内联。所以像$（window）.on（“resize”，function（）{....}）;你提供的方法是否仍然适用于这样的事情？由于在窗口大小调整时没有在组件中声明特定的函数。在我的视差示例中，它会在窗口滚动中触发。 –

我对此不是很确定，但可以试试看看它是否有效，不要在组件中声明任何内容，只需执行第1步和第2步并查看事件是否触发了您的函数。虽然我会建议使用命名函数，这使得代码更具可读性，可维护性，并符合打字原理 –

雅这就是我尝试，我的意思是....如果带有jQuery的js文件被添加到HTML文件Angular正在构建中，我会假设它自己的文件中的jQuery仍然能够像它只是一个标准的HTML文件一样运行。 –

当您使用框架作为角度时，它开始操作元素及其事件。 Jquery不像你习惯的那样工作，因为如果你只在页面末尾输入脚本一次，这些事件将被应用到当前元素，但是在角度作出任何修改之后，事件将不再起作用。

不建议将jquery与角度结合使用，但是，如果要利用尚未在特定角度插件中找到的某些功能，可以创建一个角度组件，以便进行绑定，以便必须通过应用到你想要的元素来进行jquery调用，显然理想的是你还要处理某些类型事件的解绑。

下面是一个例子：Example

来源

2017-07-27 01:40:11

混合jQuery和Angular4

回答

相关问题