在元素获得焦点后触发单击以激活typeahead

时间:2016-06-09 13:35:46

标签: angularjs onclick focus typeahead.js

需要几个问题的帮助。这是简化的代码:

HTML

    <input type="text" title="{{e.Name}}" ng-model="e.modelName" ng-required="true" typeahead-editable="false" ng-blur="vm.isUnchanged(i)" focus-me="vm.Event"
own-typeahead typeahead-on-select="vm.changeValue($item, $model, $label, i)" 
uib-typeahead="$Event, $viewValue)" typeahead-min-length="0"/>

JS

app.directive("ownTypeahead", function() {
        var directive = {
            link: link,
            scope: true,
            restrict: 'A',
            require: ["ngModel"]
        };
        return directive;

        function link(scope, element, attrs, ctrls) {

            element.bind('click', function () {
                if (ctrls[0].$viewValue && ctrls[0].$viewValue == ' ') {
                    ctrls[0].$setViewValue('');
                }
                ctrls[0].$setViewValue(' ');
            });

            element.bind('focus', function () {
                if (!ctrls[0].$viewValue || ctrls[0].$viewValue == '') {
                    ctrls[0].$setViewValue(' ');
                }
            });
        }
    });


/**
 * Directive that places focus on the element it is applied to when the
 * expression it binds to evaluates to true
 */
app.directive('focusMe', ['$timeout', function focusMe($timeout) {
    return function (scope, elem, attrs) {
        scope.$watch(attrs.focusMe, function (newVal) {
            if (newVal) {
                $timeout(function () {
                    elem[0].focus();
                }, 0, false);
            }
        });
    };
}]);

问题/问题是:

1)主要的一个。单击某些项目后聚焦几乎总是在输入字段中触发预先输入 ddl,但有几个项目会移动焦点但不会触发列表打开。问题在哪里? (上面的代码在大约90%的情况下起作用,在100%单击输入字段时起作用)

2)不理想的解决方案,但是一个好的解决方法可能是在焦点输入字段上触发单击事件以打开列表。无法设法以棱角分明的方式做到这一点。怎么做到这一点?

1 个答案:

答案 0 :(得分:0)

通过为focusMe添加 200ms 超时来实现它:

app.directive('focusMe', ['$timeout', function focusMe($timeout) {
    return function (scope, elem, attrs) {
        scope.$watch(attrs.focusMe, function (newVal) {
            if (newVal) {
                $timeout(function () {
                    elem[0].focus();
                }, 200, false);
            }
        });
    };
}]);

如果有人有更好的建议会接受答案。