如何在angular bootstrap ui中聚焦活动导航选项卡中的拳头输入字段

我不得不做一些听起来一样的事情。

更改TAB

 <button class="btn btn-default btn-sm" 
         ng-click="tabs[0].active = true">Select second tab</button>

发件人https://angular-ui.github.io/bootstrap/#/tabs

如果它是静态的，HTML5属性可能工作

<input type="text" name="fname" autofocus>

我的是动态的，所以我做了（而且，当我这样做的时候，我不知道html5的事情）

.factory('focus', function($timeout) {
        return function(id) {
            $timeout(function() {
                var element = document.getElementById(id);
                if (element)
                    element.focus();
            });
        };
    })

我只是从代码中调用它，我必须这样做，因为我的代码会改变一些东西，让一些东西出现。

我通过创建一个指令来解决问题，该指令从我的作用域中监视属性

.directive('focusFirstInputWhenActive',function ($timeout) {
            return {
                restrict: 'A',
                link: function (scope, elem) {
                    scope.$watch('myObject.active', function(isActive)
                    {
                       if(isActive){
                           $timeout(function () {
                               var availableInputs = $('input:enabled', elem);
                               $(availableInputs[0]).focus();
                               $(availableInputs[0]).select();
                           });
                       }
                    });
                }
            };
        })

html看起来是这样的：

 <tabset class="tab-content-wrapper">
      <tab ng-repeat="myObject in myObjectList" active="myObject .active">
                <div  focus-first-input-when-active>
                   //content here
                </div>
     </tab>
 </tabset>