WYSIWYG 잘못된 HTML을 시도하고 수정하지 않는 HTML 편집기

Question

PHP Blade 및 Handlebars * 템플릿을 편집 할 수있는 WYSIWYG HTML 편집기가 필요합니다. TinyMCE, CKEditor 및 bootstrap wysihtml5을 시도했지만 모두 잘못된 HTML을 수정했습니다. 누구든지 대안을 제시 할 수 있습니까?

다음을 변경하지 않고 WYSIWYG와 소스 모드간에 전환 할 수 있어야합니다.

<table> 
    <thead> 
    <tr> 
     <tr>Column 1</tr> 
     <tr>Column 2</tr> 
    </tr> 
    </thead> 
    <tbody> 
    @foreach ($data as $datum) 
    <tr> 
     <td>{{ $datum->col1 }}</td> 
     <td>{{ $datum->col2 }}</td> 
    </tr> 
    @endforeach 
    </tbody> 
</table> 

모든 편집자 나는 @foreach 때로는 너무 테이블을 깰 제거 발견했다. 나는 "시각적 인"모드가 깨져도별로 신경 쓰지 않지만 손댈 수 없도록 HTML이 필요하다.

* Handlebars 변수 앞에 $가 붙어 있으므로 블레이드 템플릿과 광범위하게 호환됩니다.

Answer 1

CKEditor를 사용할 수 있지만 코드 부분에서 편집기가 수정하지 못하도록 정의해야합니다.

CKEditor는 기능을 가지고 있습니다.이 기능을 사용하면 편집자가 건드리지 않아야하는 소스 부분을 유효 HTML로 정의 할 수 있습니다.

@foreach 루프 및 예제의 변수와 함께 사용할 수있는 예제를 만들었습니다. 당신은 당신의 요구에 맞게 그것을 가지고 그것을 향상시킬 수 있습니다 : 나는 이후

<tr> <tr>Column 1</tr> <tr>Column 2</tr> </tr>

을 변경 https://jsfiddle.net/0tw75xt3/

참고 : 여기에

CKEDITOR.editorConfig = function(config) { 
    .... 
    .... 
    config.protectedSource.push(/@foreach.*/g); 
    config.protectedSource.push(/@endforeach.*/g); 
    config.protectedSource.push(/{{.*}}/g); 
} 

가 확인할 수있는 작업 바이올린입니다 그것은 유효한 HTML이 아니며 그것이 될 것으로 짐작되지 않았습니다. <tr><tr>

좀 더 복잡한 템플릿을 지원하려면 protectedSource 내부에 좀 더 복잡한 정규 표현식이 필요하지만 실제로 시작할 때 좋은 장소가 될 수 있습니다.