切换ng-show后设置输入焦点有效

时间:2017-03-13 19:57:58

标签: angularjs

我不知道如何在ng-show / ng-hide出现之后将输入聚焦。我正在使用带df[2,][which(df[1,]!="")] 的按钮来显示和隐藏我的输入。有什么提示吗?

HTML:

ng-click="showme=!showme"

JFiddle

我尝试使用建议的here,但它不起作用。

JFiddle

我也尝试过autofocus指令,但它仍然不起作用。

1 个答案:

答案 0 :(得分:1)

我已经修复了这个添加一个控制器,我在该控制器中声明了一个新范围和一个声明焦点的属性的切换。 这是代码:

HTML:

<div ng-app="pippo" ng-controller="pippoctrl">  
  <button ng-click="showme=!showme;shouldBeOpen=!shouldBeOpen">SHOW/HIDE</button> 
  <div class="wrapper">
    <p ng-hide="showme">It will appear here!</p>
    <input focus-me="shouldBeOpen" ng-show="showme" type="text" name="s" placeholder="Search..." />
  </div> 
</div>  

JS:

var app=angular.module("pippo",[]);
app.controller('pippoctrl', ['$scope',function ($scope){ 
        $scope.shouldBeOpen=false;
}]);
app.directive('focusMe', ['$timeout' , function ($timeout) {
    return {
    //scope: true,   // optionally create a child scope
        link: function (scope, element, attrs) {
        console.log('focus-me=', attrs.focusMe);
            scope.$watch(attrs.focusMe,function(value){
                console.log('value=', value);
                if (value === true) {
                    $timeout(function () {
                        element[0].focus();
                    });

                }
            });

        }
    };
}]);

以下是完整代码:JSFiddle