任何焦点

Question

我正在构建一个可搜索/可选择的组合框，并希望在失去焦点时关闭控件。除非有一个可以接收焦点的子控件（搜索输入），否则使用tabindex和ng-blur会有效。

有没有办法检查顶级div＃combo是否有任何具有焦点的子控件？

简化代码：

<div name="combo" ng-click="show=!show" ng-show="show" ng-blur="show=false" tabindex="1">
    <input type="text" name="search" ng-model="search">
    <div ng-repeat="person in persons | filter:search">
       {{ person.name }}
    </div>
</div>

Answer 1

父素<div name="combo"下焦点唯一的元素很可能就是搜索框。 <input>元素是可以使用ng-focus指令作为HTML属性进行修饰的少数元素之一。话虽这么说，你可以在聚焦时评估一个表达式。现在，因为并非所有浏览器都符合标准和规范，并且您希望绝对确保从每个子元素中捕获焦点事件，您可以构建自己的指令放置在父元素上，并在内部检查任何子元素一直专注。为此，在该指令的链接功能中，您将需要以下内容：

...

link: function(scope, elm, attr)
{
  scope.$watch(function()
  {
    return angular.element(elm.find('*:focus'));
  },
  function(focusedElm)
  {
    /** here be dragons **/
  });
}

...