mise au point automatique du papier d'entrée ne fonctionne pas à l'intérieur de routeur de sortie dans un composant angulaire 2

Question

Disons que je les routes suivantes définies dans ma demande angulaire 2:

@RouteConfig([{ 
     component: FirstRouteComponent, 
     name: "First", 
     path: "/First", 
     useAsDefault: true 
    }, 
    { 
     component: SecondRouteComponentComponent, 
     name: "Second", 
     path: "/Second" 
    }]) 
    export class AppComponent { 
    } 

et I ont dans le modèle FirstRouteComponent:

<paper-input autofocus></paper-input> 

Quand je navigue de la route « Second » à la route « First » (par une directive [routerLink] que j'ai sur certains une étiquette statique dans la page) le papier d'entrée ne se concentre pas. Curieusement, si je suis déjà dans l'itinéraire "Premier" et que j'actualise la page, l'entrée papier est correctement mise au point. J'ai l'impression que cela a quelque chose à voir avec la façon dont le routeur angulaire 2 insère dynamiquement l'entrée de papier dans le dom, et comment le polymère utilise l'autofocus, mais je ne peux pas souligner le problème. Je me trompe peut-être et ce problème est "bizarre" parce que je n'ai eu aucun problème à passer d'autres paramètres aux composants polymères (y compris l'entrée de papier) dans mes composants avant maintenant.

Merci à l'avance pour toute aide :)

Answer 1

Vous pouvez écrire:

<paper-input #autofocus></paper-input> 
in AppComponent: 

import { AfterViewInit, ViewChildren } from '@angular/core'; 
export class AppComponent implements AfterViewInit { 
    @ViewChildren('autofocus') fc; 
    ngAfterViewInit() { 
     this.fc.first.nativeElement.focus(); 
    } 
}