Angular 2 focus and blur for input elements

4
votes

I wrote an input field in Angular 2 that has a placeholder value.

On focus, the input field should become empty.

On blur, the input field should return to the placeholder value.

However, on blur nothing happens. Here is my input field:

<input type="text" 
       placeholder={{placeholderText}}
       onfocus="this.placeholder = ''" 
       (blur)="this.placeholder = placeholderText">

How can I change the placeholder text on blur, in Angular 2?

1
javascripthtmlangular

1 Answers

8
votes

There were a few syntax issues

<input type="text" 
   placeholder={{placeholderText}}
   (focus)="placeholderText = ''" 
   (blur)="placeholderText = 'the placeholder'">