2016-07-26 12 views
0

Ich benutze diese sidenavSidenav werfen Ausnahme: Fehler bei der Auswertung von „onShown“

<div layout="column" style="height:60px;"> 
<md-sidenav-container layout="row" flex> 
<md-content flex layout-padding> 
    <div layout="column" layout-fill layout-align="top right" style="width: 50px; position: absolute; 
top: -8px; 
right: 55px; 
font-size: 18px;"> 
    <button md-raised-button (click)="open('right')" [hidden]="rightOpened" class="md-primary"> 
     Filtros 
    </button> 
    </div> 
    <div flex></div> 
</md-content> 
<md-sidenav name="right" align="right" layout="column" (onShown)="input.focus()"> 
    <md-toolbar class="md-theme-light"> 
    <h1 class="md-toolbar-tools">Sidenav Right</h1> 
    </md-toolbar> 

Danach ich verschiedene Komponenten nennen. Ich habe gerade gelernt, wie man Entwickler-Tool verwendet, um Fehler und Warnungen zu sehen, also bin ich ziemlich Newby, aber ich erinnere mich nicht, dass es vor langer Zeit warf, bevor ich viele Änderungen einführte.

Das Problem ist, ich nicht ganz den Fehler verstehen gut genug:

EXCEPTION: Error during evaluation of "onShown" 

...

ORIGINAL EXCEPTION: TypeError: Cannot read property 'focus' of undefined 

...

TypeError: Cannot read property 'focus' of undefined 
    at AbstractChangeDetector.ChangeDetector_SidenavBasicUsage_0.handleEventInternal (viewFactory_SidenavBasicUsage:361:24) 
    at AbstractChangeDetector.handleEvent 

Da ich nicht tun überall sehen, wo sich das auf meinen Code bezieht. Ich habe es geschafft, um zu sprechen, ich glaube von der Materialisierung, und jetzt frage ich mich, ob ich den Fehler immer wieder ignoriere, da es gut funktioniert, oder etwas dagegen tun (ich würde es lieber tun, aber ich weiß nicht wo anfangen, es zu stochern, damit ich es reparieren kann).

+1

Wo deklarieren Sie 'Eingabe' Variable? – yurzui

+1

... oder worauf soll sich "input" beziehen? –

+0

Ich tat es nicht, wie es in der Antwort unten erklärt wurde, es war ein Beispiel und als solches erwartete es von mir, alles richtig zu definieren, was notwendig war. Das konnte ich nicht verstehen, ich konnte es nicht richtig sehen. Danke für die Hilfe noch einmal, es mag trivial erscheinen, aber ich verbringe viel zu viele Stunden damit, dieses Zeug zu suchen –

Antwort

1

Wie von den Kommentaren erwähnt, gibt es einen Ausschnitt aus Ihrer HTML:

<md-sidenav name="right" align="right" layout="column" (onShown)="input.focus()"> 

Das Problem ist mit (onShown)="input.focus()". Dieser Code könnte aus einer Art von Beispiel stammen. In der Regel besteht die Absicht dieses Fokus-auf-Schau-Modus darin, sich auf ein Element innerhalb des Sitenavs zu konzentrieren, wenn das Sidénav sichtbar wird. Dies wird häufig sowohl für die Benutzerfreundlichkeit von Tastaturbenutzern als auch für Zugänglichkeitsgründe getan (eine sehbehinderte Person könnte sonst nicht wissen, dass das Sidénav gerade erschienen ist).

Das Problem ist jedoch wahrscheinlich, dass Sie keine Variable mit dem Namen input haben. Wenn Sie eine Variable mit dem Namen input haben möchten, die erwartet, dass sie sich konzentriert, dann gibt es ein paar verschiedene Möglichkeiten, die hätten gemacht werden können und wir haben nicht genug Code, um zu sagen, was Sie zu tun versuchten. Ein gängiges Beispiel könnte so aussehen ...

<md-sidenav name="right" align="right" layout="column" (onShown)="input.focus()"> 
    <input #input type="text" class="search"/> 
</md-sidenav> 

Notiere die #input wird eine Vorlage Referenzvariable mit dem Namen Eingang deklarieren, die an anderer Stelle in der Vorlage bezeichnet werden kann (z input.focus()).

+0

Sie haben völlig Recht, ich hatte keine solche Variable. Tatsächlich glaube ich Ich brauche es nicht, und als ich (onShown) = "input.focus()" entfernte, war der Fehler weg und der Rest des Codes funktionierte gut, also war es ein Problem, nicht zu wissen, was der Code tut sich die Zeit zu nehmen, hilft mir sehr viel –

Verwandte Themen