gpt4 book ai didi

Angular 应用程序中的 Javascript 文件

转载 作者:行者123 更新时间:2023-11-27 22:55:31 25 4
gpt4 key购买 nike

我有一个我自己编写的使用 jQuery 的自定义验证文件。它正在我网站上的几个页面中使用。
现在我需要在我网站的 Angular 应用程序部分使用它。我想包含这个文件,它应该以同样的方式工作。我无法将该文件更改为指令或其他 Angular 文件,因为它正在我网站的其他部分使用。
该验证器的工作原理是向输入添加类,jquery 监视这些元素并在操作发生后进行验证。
HTML:angularview.html

<input type="text" ng-model="vm.Email" name="email" class="required pattern" pattern_type="email" />

Javascript:formvalidation.js

$('.required, .pattern').on('blur', function () {
if ($(this).hasClass('required') && !$(this).val()) {
addError(this, 'required');
return;
}
if ($(this).hasClass('pattern') && !isValidInput($(this).attr('pattern-type'), $(this).val())) {
addError(this, 'invalid');
return;
}
});

问题:

如何让这个 javascript 文件在我的 Angular View 中运行?
编辑:
我会尽量说得更清楚。
不是 jquery 插件。这是我自己的 javascript 文件,它使用 jquery 工作。我观察具有特定类名称的输入,并在更改时调用页面上的函数进行验证(请参阅示例)。 我将如何在指令中使用它,或者是否有一种方法可以通过向我的输入添加正确的类来调用此文件中的函数?

最佳答案

您的方法可能不属于 Angular 的最佳实践。但我会给出你需要的答案。

您可以非常简单地通过脚本标记包含您的文件。也许您应该在 body 末尾执行此操作,以确保当您的 jquery 尝试绑定(bind)事件时加载 DOM。

Angular 不会阻止其他脚本的执行。您只需确保两个不同的系统不会尝试向 DOM 元素添加相同的事件监听器。

此外,将 Jquery 代码包装在一个函数中以防止它乱七八糟地占用全局空间也是一个好主意。这种函数的另一个优点是,当新 View 动态添加到 DOM 时,您可以手动执行它。

关于Angular 应用程序中的 Javascript 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37662102/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com