Clever Geek Handbook

Uncheck the box when entering text and open text input when the box is checked

I have a search bar and a checkbox:

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

Whenever anyone types into the search bar, I want the checkbox to be unchecked. Likewise, whenever anyone checks a checkbox, I want the search bar to be cleared.

I've tried the following:

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

But that obviously doesn't work.

Here is a plunker with the above code: https://plnkr.co/edit/uAYxswpoz18jlRUqAMn5?p=preview

What's the best way to achieve this functionality?

Thank!

+3


source to share


2 answers


You were almost there. First of all, I advise you to use boolean values ​​for checkbox data models. The array is true, so the checkbox is still checked. If you refer to instance properties, you must refer to them using the word this

. So the methodonKey()



it should be: 
onKey() { 
 this.checkbox = false
}

plunker

+2


source


In your make function, this.checkbox will be false.

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

your function



 onKey() { 
     this.checkbox = false;
  }

DEMO

+1


source






More articles:


All Articles