2016-07-01 3 views
0

나는 primeng 편집기 내에서 퀼 편집기를 사용하고 있습니다. 타이핑 (텍스트 변경) 중에 텍스트에 스타일을 적용하고 싶습니다. 슬래시 안에 텍스트를 입력 할 때 스타일을 적용해야하고 2 개의 슬래시를 제거해야합니다. 예 : 저는/quill/editor를 사용하고 있습니다. 다음과 같아야합니다. 편집기를 사용하고 있습니다.퀼 편집자가 텍스트에 스타일을 적용합니다.

슬래시 내 텍스트 만 스타일에 적용해야합니다. 슬래시 내의 텍스트는 스타일을 적용해서는 안됩니다.

나는

this.quill.on('text-change', (delta, source) => { 
      if (source == 'user') { 
      this.highlightText(); 
      this.selfChange = true; 
      let htmlValue = this.quill.getHTML(); 
      if (htmlValue == '<div><br></div>') { 
       htmlValue = null; 
      } 

      this.onTextChange.emit({ 
       htmlValue: htmlValue, 
       textValue: this.quill.getText(), 
       delta: delta, 
       source: source 
      }); 
      //if (this.selfChange) 
      this.onModelChange(htmlValue); 
      // } 
     }); 

highlightText() { 
     var text = this.quill.getText(), 
      hashRegex1 = /\/[a-zA-Z\.\*\&\s\d]*\//ig, 
      match; 

     // Try to clear all cssClass formats 
     this.quill.formatText(0, this.quill.getLength(), 'cssClass', false); 

     while (match = hashRegex1.exec(text)) { 
      this.quill.formatText(match.index, match.index + match[0].length, 'cssClass', 'test'); 
      this.quill.deleteText(match.index, match.index + 1); 
      var textLenth = match[0].length - 2; 
      this.quill.deleteText(match.index + textLenth, match.index + textLenth + 1); 
      this.quill.prepareFormat('bold', false); 
      this.quill.focus(); 

     } 
    } 

을 Editor.ts 다음 코드를 추가했지만 문제는 한 번 텍스트 유입이 (굵게) 강조지고 다음, 텍스트를 강조 표시됩니다. 나는 텍스트를 강조 표시 한 후에 텍스트를 강조 표시 할 수 없으며 강조 표시된 텍스트 뒤에 모든 텍스트가 강조 표시됩니다. 이것 좀 도와주세요.

답변

0

formatText을 사용하면 임의의 텍스트 범위에 서식을 적용 할 수 있습니다. Quill 1.0 베타를 사용하는 경우 contextual keyboard handlers을 사용하면이 작업을 더 쉽게 수행 할 수 있습니다.