Question

当我给它提供可视性（ng-show值变为true）时，我想关注我表单中的特定输入。
为此我写了一个指令：

angular.module('ui.directives', []).directive('autoFocus',
    function ($timeout) {
        return {
            scope: {
                trigger: '@autoFocus'
            },
            link: function (scope, element) {
                scope.$watch('trigger',

                function (value) {
                    if (value === 'true') {
                        $timeout(function () {
                            console.log('autoFocus: giving focus to element by id:', element[0].id);
                            element[0].focus();
                        });
                    }
                });
            }
        };
    }
);

这不起作用，也不适用于Firefox或Chrome。

这是一个显示我的意思的jsfiddle ...

我认为问题是指令在页面加载时运行...
如何在ng-show上执行它变成了现实？（对不起，角度很新......： - （）

Answer 1

您的autoFocus属性的值（指令内的trigger）应该与show变量具有相同的值，因为您希望在show的值时发生某些事情变化：

angular.module('ui.directives', []).directive('autoFocus',

function ($timeout) {
    return {
        scope: {
            trigger: '=autoFocus'
        },
        link: function (scope, element) {
            scope.$watch('trigger',

            function (value) {
                if (value) {
                    $timeout(function () {
                        console.log('autoFocus: giving focus to element by id:', element[0].id);
                        element[0].focus();
                    });
                }
            });
        }
    };
});

<input type="text" id="b" value="B" auto-focus="show" />

工作小提琴：http://jsfiddle.net/ex9d6oa4/

Angular：如何在显示表单时将焦点放在input元素上？

1 个答案: