2017-07-09 2 views
3

ich eine Suchleiste haben und das Kontrollkästchen wie so:Uncheck Checkbox auf Texteingabe & Klartexteingabe, wenn Checkbox aktiviert ist

<input type="text" placeholder="Search..." (keyup)="onKey()" [(ngModel)]="input"> 
<input type="checkbox" (click)="clearSearch()" [(ngModel)]="checkbox">View All 

Jedes Mal, wenn jemand Arten in die Suchleiste ich die Checkbox deaktiviert werden will. Ebenso, wenn jemand das Kontrollkästchen aktiviert, möchte ich die Suchleiste gelöscht werden.

Ich habe versucht, die folgenden:

export class App { 
checkbox = ['checked'] 
clearSearch() { 
this.input = ''; 
}; 
onKey() { 
checkbox = ['unchecked'] 
} 

Aber es hat offensichtlich nicht ganz funktioniert.

ist hier ein Plunker mit dem obigen Code: https://plnkr.co/edit/uAYxswpoz18jlRUqAMn5?p=preview

Welches ist der beste Weg, um diese Funktionalität zu erreichen?

Danke!

Antwort

2

Sie waren fast da. Zunächst rate ich Ihnen, boolesche Werte für Checkbox-Datenmodelle zu verwenden. Array wird als wahr ausgewertet, daher ist das Kontrollkästchen noch aktiviert. Wenn Sie Instanzeigenschaften referenzieren, sollten Sie sie mit dem Wort this referenzieren. So ist die Methode onKey() sollte sein:

onKey() { 
this.checkbox = false 
} 

plunker

1

In Ihrer Funktion make this.checkbox zu false.

<input type="checkbox" (click)="clearSearch()" [(ngModel)]="checkbox">View All 

Ihre Funktion

onKey() { 
    this.checkbox = false; 
    } 

DEMO

Verwandte Themen