指令只被调用一次

时间:2016-11-18 10:01:43

标签: javascript angularjs typescript angularjs-directive angular-material

我已经在输入字段中创建了一个自定义指令。该指令的目的是分析Inputfield中的值/数据。 This directive is supposed to be called everytime the inputField is given focus/cursor.

但问题是,我的自定义指令只被调用一次。我不确定为什么每次输入字段被聚焦时都不会调用它。

我在这里做错了什么?

我是Angular的新手,所以我确信在某个地方有一些重要的细节。

这是plunker

1 个答案:

答案 0 :(得分:2)

这是预期的行为,链接函数只对指令的任何给定实例调用一次。由于您对fig.cap事件感兴趣,我在该指令应用的元素中添加了一个事件监听器:

focus

Plunker

由于您还提到了'游标',您可能也对var mainApp = angular.module("myapp", ['ngMaterial']); mainApp.directive("myDirective", function($log) { return { restrict : 'A', require : "ngModel", scope : { myDirective : "=" }, link : function(scope, element, attrs, ngModel) { element.on('focus', doSomething); function doSomething() { $log.log("value is:", scope.myDirective); if (ngModel.$isEmpty() && scope.myDirective && scope.myDirective.length > 0) { ngModel.$setUntouched(); ngModel.$setValidity(); } } } } }); 事件感兴趣。它就像添加另一个事件监听器一样简单:

mouseover

注意:我添加了对element.on('mouseover', doSomething)的额外检查,以避免在阅读scope.myDirective的{​​{1}}时出现控制台错误。

根据OP的要求:

我不知道jqLit​​e是否支持所有这些,但是对于所有DOM事件的列表,你应该检查这个page,你可能最感兴趣的是焦点,键盘和&鼠标事件。

有关所有jqLit​​e函数的列表,请选中this