基于ABP做一个简单的系统——实战篇：4.基于富文本编辑器，Razor模板引擎生成内容并导出Word 填坑记录

起因

需求是这样的，有一种协议需要生成，协议的模板是可配置的，在生成过程中，模板中的内容可以根据约定的标记进行替换（就像mvc的razor模板一样）。生成后的内容还需要导出成word或pdf。

常见的使用场景比如租赁协议生成，邮件内容模板生成等等，不要傻傻的hard-code像‘#name#’这样的标记了。

优势就是可自定义模板，灵活匹配可获取到对象的任何字段，解除开发侧的包袱

开源框架

wangEditor 简单的富文本编辑器，基本功能够用，使用方便
RazorLight.NetCore3 基于Razor模板动态生成内容
html2openxml 一个把html转换为Xml的组件，依赖于DocumentFormat.OpenXml

 

富文本编辑器

wangEditor已经更新到V3了，功能简洁高效，配置简单，爽的飞起，简单配置后就用起来。

注意一点就是，想要用razor生成，模板的内容要尽量保持干净，不要混入html代码之外的内容。如果直接把word文档粘贴到editor中，界面上看起来是完好的，但其实会混进来很多xml的东西，像这样的成千上万行：
<w:LsdException Locked="false" Priority="99" SemiHidden="false" Name="Colorful Grid Accent 6" >w:LsdException>

然后导致razor模板运行失败。解决方法如下：

用wangEditor的pastTextHandle，在文本内容被帖进去之前，把影响razor的字符处理掉。   var E = window.wangEditor;

    var editor2 = new E('#demo');
    editor2.customConfig.pasteTextHandle = function (content) {
        return setEditor(content);
    }


//设置wangeditor格式，去掉word的xml内容
function setEditor(content) {
    // content 即粘贴过来的内容（html 或 纯文本），可进行自定义处理然后返回
    if (content == '' && !content) return '';
    var str = content;
    str = str.replace(/[\s\S]*?<\/xml>/ig, '');
    str = str.replace(/