CODEWITHSUNDEEP
dartangular-dart
patrykf
patrykf

Reputation: 449

How to set focus for element on page load?

I am new to AngularDart and I want to focus the first input on page (with my attribute from decorator) but I can't figure out how to do this. This is my decorator:

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

@Decorator(selector: '[autofocus]')
class InputFocus implements AttachAware {
    final html.InputElement element;

    InputFocus(html.Element this.element) {
        element.onFocus.listen((_) => print('element focused'));
    }

    @Override
    attach() {
        element.focus();
    }
}

When I click on the element the message is printed so the element is the on I am looking for. Somehow the element isn't focused on attach cause the message isn't printed when I reload the page. How can I achieve my goal? Maybe there is another approach to reach the element when the DOM is rendered?

Thanks in advance!

Upvotes: 2

Views: 1659

Answers (1)

Günter Zöchbauer
Günter Zöchbauer

Reputation: 657376

Some delay should help

new Future.delayed(const Duration(milliseconds: 50), () => element.focus());

Upvotes: 3

Related Questions