Angular 2 focus and blur for input elements

Question

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?

Answer 1

There were a few syntax issues

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