This is my input field
<input
(keyup.enter)="save()"
(focusout)="save()"
class="editinput custom_story_input"
type="text"
placeholder="Create a new one"
id="tbtfeild"
value="" [(ngModel)]="childTaskmodel.childtitle"
#childtitle="ngModel"
name="childtitle" />
From the above input field, I don't have any problem with enter if the field is empty it shows the error message
Coming to focus out it should only work if there is any data present in the input field how can i do this..?
i want something like this:
<input *ngIf (focusout)="childtitle.val != '' ? save() : '' " >
Welll you can do that :
<input [(ngModel)]="childtitle" (focusout)="childtitle ? save() : null">
test it : unless your input has a value, it won't work.
EDIT Explanation :
you first bind your variable to the input with [(ngModel)]="childtitle"
: this allows you to let angular know that he has to watch for changes on that variable.
Next, you bind an HTML event to this input, with (focusout)="childtitle ? save() : null"
. As a value, you write a ternary operator : this is a one-liner for a if ... else ...
condition. In that ternary, you state that if this input has a value (this is a truthy value, a Javascript concept, you will find more on the internet), then you can run the function. If not, then you just run null
, which ... Does nothing.