0

我目前正在学习 AngularJS，我想完成一个简单的任务。在表单输入中，即使输入的数据无效，我也想隐藏相应的“输入帮助”。我目前这样做的方式调用了一些 jquery。但我正在寻找使用 AngularJS 逻辑的方法。我认为我应该使用指令，但由于我是 Angular 新手，我不知道该怎么做。

这是使用 jquery 工作的 jsFiddle 示例代码：JSFIDDLE

这里是 jsFiddle 示例代码不起作用（没有 jquery）：JSFIDDLE {为了测试，在密码输入中只输入几个文本并模糊它}

这是我的代码：{jquery}

$(document).on('blur', '.immediate-help', function () {
    $(this).next('.input-help').fadeOut();
}).on('focus', '.immediate-help', function () {
    $(this).next('.input-help').fadeIn();
});

这按预期工作，但我想使用角度指令来做到这一点。当然，我并不反对在 angular 指令中使用 jquery。

因此，要恢复，我想在触发模糊输入以隐藏“输入帮助”时，即使文本无效并使用角度指令。

有人可以告诉我正确的方法吗？

4

2 回答 2

1

几种方法：

在指令中使用脚本：

elmlink如果 jQuery.js 在页面中的 anugular.js 之前加载，则指令回调中的参数是一个 jQuery 对象……或者如果不包括 jQuery.js，它是一个 jQlite。

jQlite 有许多最常见的 jQuery 方法，因此您可以使用：

elm.bind('blur....

有关 jQlite 方法的列表，请参阅angular.element 文档。

使用ng-class

给表单和控件一个name. 这将创建一个formName具有由字段名称表示的属性的对象。然后，您可以将角度表达式用于类或disabled标记中​​的属性

<form name="myForm">
    <input name="passord"/>
    <div ng-class="{ShowMeClassName: myForm.password.$invalid}"> Error content</div>
</form>

ng-classShowMeClassName将根据password表单命名字段的有效性切换类myForm

于 2013-04-17T11:14:30.977 回答
1

您可以使用Angular-ui。

Angular-UI 提供了一堆指令，可以帮助你。你有 ui-event 指令。

例如，您可以使用

<input ui-event="{ blur : 'blurCallback()' }">
...
<script>
$scope.blurCallback = function() {
alert('Goodbye');
};
</script>
于 2013-04-17T11:11:41.240 回答