У меня есть компонент AngularDart, как заставить поле ввода текста автоматически фокусироваться каждый раз, когда компонент отображается?

У меня есть текстовый ввод в компоненте AngularDart, например:

<input type="email" id="inputFirstName" ng-model="cmp.inputFirstName">

Как я могу сделать автоматическую фокусировку ввода текста каждый раз, когда компонент отображается?

Я попытался установить автофокусировку атрибута html5, но это работает только при первом отображении компонента.


dart html angular-dart
person Phil    schedule 27.04.2014    source источник
comment
Почему это показывает чаще, чем один раз?   -  person Günter Zöchbauer    schedule 27.04.2014
comment
Поскольку компонент находится в представлении, а это одностраничное приложение, человек возвращается к представлению во второй раз, в третий раз и снова и снова. Компонент представляет собой простую форму для ввода сведений о клиенте.   -  person Phil    schedule 27.04.2014
comment
Вы пробовали использовать функцию .focus()? Отображение компонента означает, что должен быть обратный вызов enterView() - так что вы могли бы тогда вызвать .focus() на входе?   -  person Robert    schedule 27.04.2014
comment
enteredView() от Polymer, вопрос про Angular, но attach() эквивалентен в Angular.   -  person Günter Zöchbauer    schedule 27.04.2014

Ответы (1)


arrow_upward
5
arrow_downward

Вы можете попробовать использовать для этого пользовательскую директиву (новый декоратор):

import 'package:angular/angular.dart' as ng;
import 'dart:html';

@ng.Decorator(selector: '[autofocus]')
class AutoFocusDecorator implements ng.AttachAware{
  InputElement inputElement;

  AutoFocusDecorator(Element this.inputElement);

  @override
  void attach() {
    inputElement.focus();
  }
}

и использовать его как

<input type="email" id="inputFirstName" ng-model="cmp.inputFirstName" autofocus>
person Günter Zöchbauer    schedule 27.04.2014