html5 – 我有一个AngularDart组件,如何在每次组件显示时让文本输入字段自动聚焦?

我在AngularDart组件中有一个文本输入,如下所示:

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

如何在每次组件显示时使文本输入自动对焦?

我尝试设置html5属性自动对焦,但这仅在第一次显示组件时有效.

解决方法

您可以尝试使用自定义指令(新装饰器):

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>

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码