更新innerHTML值会将光标位置更改为起点

Question

HTML：

<h1 contenteditable="true" [innerHTML]="myData['name']" (click) = "myFunc($event)"></h1>

TS：

myData = {name: "test"};

myFunc ($event) {
     changedVal = $event.target.innerHTML;
     myData['name'] = changedVal; //this will update the innerHTML of h1
}

在编辑可编辑的h1元素值时，每次光标移动到起始点