AngularJS-自动对焦无法正常工作

时间:2019-07-19 10:23:40

标签: html angularjs

我的两个页面的自动更正功能出现问题。上下文是,当我的功能按我的模式视图的预期运行时:

app.directive('autoFocus', function($timeout) {
    return {
        restrict: 'AC',
        link: function(_scope, _element) {
            $timeout(function(){
                _element[0].focus();
            }, 0);
        }
    };
});

但是在我的两个页面上,您将单击该按钮移至另一页面(如上所示):

<div ng-controller="UserCtrl">
    <div class="row">
        <div class="col-xs-12 col-md-12">
            <div class="widget">
                <div class="widget-header">
                    <div class="col-xs-6 col-md-6 text-align-left no-padding-left">
                        <h4>Site User List</h4>
                    </div>
                    <div class="col-xs-6 col-md-6 no-padding-right pull-right">
                        <span class="pull-right padding-5 padding-right-10">
                            <a  ui-sref="app.siteUserEdit({siteUserId:'new'})" href type="button" class="btn btn-sm shiny" >Create New User</a>
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

自动聚焦在此页面上根本不起作用:

<div ng-controller="SiteUserEditCtrl" ng-show="readyToRender">

    <div ng-show="isNewSiteUser">
        <div class="col-xs-6 col-md-6">
        <div class="widget">
            <div class="widget-header">
                <span class="widget-caption">User Details</span>
                <div class="widget-buttons">
                    <a href="" widget-expand class="blue"></a>
                </div><!--Widget Buttons-->
            </div>
            <div class="widget-body">
                <div class="row">
                    <div class="col-xs-8 col-md-8">
                        <form class="form-horizontal" name="userDetailsForm">
                            <fieldset>
                                <div class="form-group"
                                     ng-class="{ 'has-error' : userDetailsForm.firstName.$invalid}">
                                    <label class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">First
                                        Name</label>
                                    <div class="col-lg-6 col-sm-6 col-xs-6">
                                        <input type="text" class="form-control"
                                               id="firstName" name="firstName"
                                               ng-model="targetEntity.firstName" placeholder="First Name"
                                               auto-focus>
                                        <p ng-show="userDetailsForm.firstName.$invalid"
                                           class="help-block">Optional field, maximum length 63 characters.</p>
                                    </div>
                                </div>
                            </div>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </div>
</div>

我应该注意,我已经大大缩减了代码,但是这些是我认为相关的主要问题。

0 个答案:

没有答案