从jQuery调用$ setValidity

时间:2013-03-20 20:32:56

标签: jquery angularjs angularjs-directive

我有一个文件上传器,我喜欢用jQuery编写的UI。它在更改操作上绑定到我的文件元素。更改操作显示了一个漂亮的预览和其他很酷的东西。它还会检查mime-type是否在我的有效mime类型列表中。

此外,我已经将angularJS连接起来并监视我的表单,并且我编写了许多指令来完成所有验证。我尝试为我的文件输入字段编写验证但由于某种原因它永远不会被解雇。做一些谷歌搜索表明它因为angular不支持文件输入类型。

所以我将以下代码直接添加到我的jQuery更改操作中:

    angular.element(myinput).scope().$apply(function(scope){
      scope.project.avatar.$setValidity('image',false);
    });

我可以看到调试器中的有效性被正确设置为false,但我所拥有的ng-class操作却没有看到它。所以除此之外,我有以下标记:

<div ng-class="{error: project.avatar.$invalid}">You did it wrong</div>

该课程永远不会被添加。

从Angular文档看来,$ apply应该强制刷新模型,以便所有内容都重新同步。那显然没有发生,但我不确定我做错了什么。谷歌搜索给了我很多关于如何从Angular中调用jQuery的例子,但是关于如何从jQuery中调用Angular的信息非常少。任何建议将不胜感激!

2 个答案:

答案 0 :(得分:0)

您可以尝试使用以下代码

<div ng-class="{error: project.avatar.image}">You did it wrong</div>

此处validationErrorKeyimage,因此输入类型文件的$error对象将有一个名为image的密钥,该密钥将为true或{ {1}}基于您在验证后设置的内容。

答案 1 :(得分:0)

您可能正在寻找的是

标记

<div ng-show="project.avatar.$invalid">You did it wrong</div>

JS

    var valid = some logic;
    angular.element(this).scope().$apply(function(scope){
        scope.project.avatar.$setValidity('image', valid);
    });

演示:Fiddle