angularjs ng-blur 在 Chrome 或 Firefox 中不起作用答案

【问题标题】：angularjs ng-blur not working in Chrome or Firefoxangularjs ng-blur 在 Chrome 或 Firefox 中不起作用
【发布时间】：2014-11-21 12:02:40
【问题描述】：

我正在使用 ui.bootstrap 折叠指令来显示下拉菜单。当用户在 div 之外点击时，我想自动折叠它。

当用户点击过滤器按钮时，我使用以下方式设置焦点：

.directive('setFocus', function () {
         return {
            restrict: 'A',
            scope: {
                focusValue: "=setFocus"
            },
            link: function ($scope, $element, attrs) {
                $scope.$watch("focusValue", function (currentValue, previousValue) {
                    if (currentValue === true && !previousValue) {
                        $element[0].focus();
                        console.log('set focus  from setFocus directive');
                    } else if (currentValue === false && previousValue) {
                        $element[0].blur();
                        console.log('blurr from setFocus directive');
                    }
                })
        }
        }
});

HTML

<div collapse="isDropDownCollapsed" class='div2' align-element-right='el1' set-focus='!isDropDownCollapsed' ng-blur="toggleMenu()">

控制器

app.controller('testCtrl', function ($scope) {
$scope.isDropDownCollapsed = true;
$scope.toggleMenu = function () {
    $scope.isDropDownCollapsed = !$scope.isDropDownCollapsed;
}

});

它在 IE v11 中有效，但选中复选框时焦点也会丢失。它不适用于 Chrome v38 或 Firefox v33.1。

example code

【问题讨论】：

标签： javascript angularjs angular-ui-bootstrap