Angular 2 - AUSNAHME: Expression ‚ngClassUntouched hat sich geändert, nachdem geprüft wurde

Question

Die vollständige Fehlermeldung lautet:

angular2.dev.js: 23597 AUSNAHME: Expression 'ngClassUntouched in myComponent @ 7: 12' geändert, nachdem es überprüft wurde. Vorheriger Wert: 'wahr'. Aktueller Wert: 'false' in [ngClassUntouched in MyComponent @ 7: 12]

Die Fehlerpunkte dieser Steuerung:

<input [(ngModel)]="searchTxt" class="searchText" type="text" 
class="form-control" placeholder="Search all departments & sites" 
(keypress)="handleKeyboard($event)" [ngClass]="{noBorder: tags.length >  
0}" (keyup)="handleKeyboard($event)" autocomplete="off"/> 

Im Grunde ist dies auf das KeyUp-Ereignis tritt ein, wenn ich ausführen die folgende Befehl, um den Fokus von searchTxt an den dynamisch erzeugten Eingabe zu ändern:

this.inputs.toArray()[0].nativeElement.focus(); 

Weitere Details: Dies ist der dynamisch erzeugten Array der Eingänge:

<div *ngFor="#item of records?.data"> 
<input #input name="r{{item.id}}" class="focusInputBox" type="text"/> 
</div> 

Diese Eingänge ist ein Ergebnis von:

@ViewChildren('input') inputs; 

Irgendwelche Vorschläge?

ty !!!

UPDATE: bemerkte ich, dass Winkel wenige Klassen auf der searchTxt hinzugefügt: class = "form Kontrolle search ng-unangetastet ng-valid ng-dirty"

die ng-unangetastet Raises in searchTxt hinzugefügt wurde, wenn Ich stelle den Fokus der Eingabefelder ein.

Answer 1

Wrap focus() in setTimeout(...) ist es das, was die Klasse verursacht zu einer Zeit eingestellt werden Angular erwarten keine Änderung:

setTimeout(() => { 
    this.inputs.toArray()[0].nativeElement.focus(); 
}, 0); 

Answer 2

Vielleicht könnten Sie die ChangeDetectorRef in Ihrer Komponente injizieren und ruft seine detectChanges Methode:

constructor(private cdr: ChangeDetectorRef) {} 

ngOnInit() { 
    this.cdr.detectChanges(); 
} 

der Aufruf dieser Methode an einem anderen Ort durchgeführt werden, da es Sie Ihre Tags laden auf dem Weg hängt ...