<span[attr.contenteditable]="canEditOption"(blur)="opt.name=$event.target.innerText">{{opt && opt.name}} </span>
In the above code when I insert only one character it will copy the same character when the blur event fired. Otherwise it will work fine. This happen only in chrome browser