不对母元素开火的模糊
不对母元素开火的模糊
提问于 2014-09-20 21:41:12
我正试着在<tr ng-blur="blurFn()">上使用ng模糊，但它不会触发。它只在子<input>元素上触发。
这并不是<tr>或<td>特有的。根据角文档的说法，ng-blur对不存在“气泡”的模糊事件起反应。“聚焦”事件泡沫，但没有ng聚焦。
我是遗漏了什么，还是需要创建一个新的指令来处理焦点事件？
下面是代码片段和小提琴
html
<div ng-app="App">
<div ng-controller="Ctrl as ctrl">
<table>
<tr ng-repeat="item in ctrl.items" ng-blur="ctrl.blurFn()">
<td><input ng-model="item.A"/></td>
<td><input ng-model="item.B"/></td>
</tr>
</table>
</div>
</div>js
angular.module("App", [])
.controller("Ctrl", function(){
this.blurFn = function($event){
console.log($event.target);
};
this.items = [
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"}
];
});Stack Overflow用户
回答已采纳
发布于 2014-09-20 22:13:15
一种方法就是创建一个自己的焦点输出指令。
angular.module("App", [])
.controller("Ctrl", function(){
this.blurFn = function($event){
console.log("Yay, blurred");
this.name = "focessed out at" + $event.target.name;
};
this.items = [
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"},
{A: "111", B: "222"}
];
//This is just the way other handlers are defined...
}).directive('focusout', ['$parse', function($parse) {
return {
compile: function($element, attr) {
var fn = $parse(attr.focusout);
return function handler(scope, element) {
element.on('focusout', function(event) {
scope.$apply(function() {
fn(scope, {$event:event});
});
});
};
}
};
}]);<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<div ng-app="App">
<div ng-controller="Ctrl as ctrl">
{{ctrl.name}}
<table>
<tr ng-repeat="item in ctrl.items" focusout="ctrl.blurFn($event)">
<td><input ng-attr-name="A{{$index}}" ng-model="item.A"/></td>
<td><input ng-attr-name="B{{$index}}" ng-model="item.B"/></td>
</tr>
</table>
</div>
</div>
您可能想知道，firefox中不支持焦点事件。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25953567
复制相关文章
相似问题
腾讯云开发者
