我们可以在 Web 应用程序中同时使用 jQuery 和 AngularJS 吗？

Posted 2023-05-08

【中文标题】我们可以在 Web 应用程序中同时使用 jQuery 和 AngularJS 吗？

【英文标题】：Can we use both jQuery and AngularJS in our web application?

【发布时间】：2017-02-03 14:02:02

【问题描述】：

我已经阅读了一些建议，说不要在您的项目中同时使用两者，因为它们都有不同的生命周期。

我们的要求是使用 ASP.NET WebApi 和 AngularJS 构建响应式 Web 应用程序；现在为了让我们的应用程序具有响应性，我们希望使用 Bootstrap，而 Bootstrap 需要 Bootstrap CSS 和 jQuery 库；那么我们应该将 jQuery 库和 AngularJS 库都添加到我们的项目中吗？

【参考方案1】：

可以，但不推荐，因为 jQuery 增加了很多开销。 如果您要编码“角度方式”，那么您将不会破坏角度功能。例如，如果您尝试调整字段的值，那么在您手动触发摘要之前，您的范围不会更新。它会导致垃圾代码和不一致的行为。

Angular 是否使用 jQuery 库？

是的，如果 jQuery 存在于您的应用程序中，Angular 可以使用 应用程序正在被引导。如果 jQuery 不存在于您的 脚本路径，Angular 回退到它自己的实现 jQuery 的子集，我们称之为 jQLite。

Angular 1.3 仅支持 jQuery 2.1 或更高版本。 jQuery 1.7 和更新的版本可能与 Angular 一起正常工作，但我们不保证这一点。

Source

另见这个问题：Should we use jQuery with AngularJS?

如果您真的确定要使用 jQuery，请确保首先包含 jQuery 脚本。然后 Angular 将加载 jQuery 代替 JQ lite。

【讨论】：

“我们是否应该将 JQuery 与 AngularJS 一起使用”的链接毫无用处，因为他们正在谈论将网站从 JQuery 迁移到 AngularJS，而不是 JQuery 是否与 Angular 一起使用。

【参考方案2】：

是的，您可以在同一个项目中同时使用 Jquery 和 AngularJS。根据AngularJS documentation

Angular 是否使用 jQuery 库？

是的，如果 jQuery 存在于您的应用程序中，Angular 可以使用 应用程序正在被引导。如果 jQuery 不存在于您的 脚本路径，Angular 回退到它自己的实现 jQuery 的子集，我们称之为 jQLite。

Angular 1.3 仅支持 jQuery 2.1 或更高版本。 jQuery 1.7 和更新版本 可能与 Angular 一起正常工作，但我们不保证这一点。

你也需要记住，

如果 jQuery 可用，则 angular.element 是 jQuery 函数的别名。如果 jQuery 不可用，则 angular.element 委托给 Angular 的内置 jQuery 子集。

如果您想在项目中使用任何 Jquery 插件，请确保将它们转换为 angular 指令。

【参考方案3】：

您可以将 JQuery 与 AngularJS 一起使用。 AngularJS 也有一个轻量级版本JQLite，它包含 AngularJS 项目所需的所有 JQuery 功能。

首先建议使用纯 AngularJS，但如果出于某种原因只是 AngularJS 没有解决它，您可以使用 JQuery 来填补空白。如果您确实选择将 JQuery 与 AngularJS 一起使用，则必须开始考虑到您在 AngularJS 视图之外所做的一切都需要您额外考虑，因为如果 Angular 不知道更改，它就不会将该更改应用于任何内容。