angular 2 – 在elementRef上设置选择

发布时间：2020-12-17 17:10:43 所属栏目：安全来源：网络整理

导读：我有这个选择： let selection = window.getSelection(); 而这个元素参考： @ViewChild('contentEditable') public el: ElementRef; 例如,这个文本在contenteditable elementRef中： This is some text 我选择’some’然后丢失了选择但是使用getSelection()

我有这个选择：

let selection = window.getSelection();

而这个元素参考：

@ViewChild('contentEditable') public el: ElementRef;

例如,这个文本在contenteditable elementRef中：

This is some text

我选择’some’然后丢失了选择但是使用getSelection()将其保存在selection属性中.我如何在elementRef上重新设置它？

解决方法

我把输入与contentEditable混淆了.使用contentEditable,您需要使用范围来获取选择并设置选择.

要获得选择：

let range = document.createRange();
range = window.getSelection().getRangeAt(0);
this.rangeClone = range.cloneRange();

这使用了Javascript中Selection和Range对象的组合.有关详细信息,请阅读文档：

Selection

Range

要设置选择：

this.el.nativeElement.focus();
const sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(this.rangeClone);

This.el看起来像这样：

@ViewChild('contentEditable') public el: ElementRef;

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!