问题描述:

I'm using the directive angucomplete-alt and I'm facing an issue to set the focus on input as soon as the page loads, but I don't know how to do it and the solutions that I have found seem very hacky.

Example code:

<angucomplete-alt id="ex2"

placeholder="Search people"

pause="300"

selected-object="selectedPerson"

local-data="people"

local-search="localSearch"

title-field="firstName,surname"

description-field="twitter"

image-field="pic"

minlength="1"

input-class="form-control form-control-small"

match-class="highlight" />

网友答案:

Well, I don't know this directive, but it seems you can't set focus on input without some hacky. I made some searchs on their github and I found the same issue there and there is a possible solution that can solve your problem.

Here's is a snippet working:

var app = angular.module('app', ['angucomplete-alt']);

app.controller('mainCtrl', function($scope, $timeout) {
   $timeout(function() {
     var searchInput = document.getElementById('ex2_value');
     searchInput.focus();
   }, 0);
});
<!DOCTYPE html>
<html ng-app="app">

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angucomplete-alt/2.4.1/angucomplete-alt.min.js"></script>
</head>

<body ng-controller="mainCtrl">
  <angucomplete-alt id="ex2"
          placeholder="Search people"
          pause="300"
          selected-object="selectedPerson"
          local-data="people"
          local-search="localSearch"
          title-field="firstName,surname"
          description-field="twitter"
          image-field="pic"
          minlength="1"
          input-class="form-control form-control-small"
          match-class="highlight" />
</body>

</html>
相关阅读:
Top