Summernote:以编程方式插入代码视图

时间:2016-10-27 21:55:37

标签: javascript wysiwyg summernote

我正在尝试以编程方式将一些html插入到summernote的CODE视图中,如下所示:

var markupStr = 'hello world';
$('#summernote').summernote('code', markupStr);

引用此summernote documentation和此SO Answer。我希望在CODE视图中进行此插入,但这不会发生。

enter image description here

但是,如果我在DEFAULT非代码视图中尝试进行此插入(使用相同的代码),则按预期插入。当切换到CODE视图仍然显示为预期。

enter image description here

看起来我的问题可能与此summernote GitHub issue有关,但不确定。

想知道你们中的任何一个summernote用户是否已经找到了一种以编程方式直接插入代码视图的方法?

2 个答案:

答案 0 :(得分:0)

哈克:

var markupStr = 'hello world';
$(angular.element.find("div.note-editor button.btn-codeview")[0]).click()
$('#summernote').summernote('code', markupStr);
$(angular.element.find("div.note-editor button.btn-codeview")[0]).click()

答案 1 :(得分:0)

我想,这段代码将解决问题。您可以使用codeview.activate在代码视图中初始化summernote。

$('.summernote').on('summernote.init', function () {
      $('.summernote').summernote('codeview.activate');
    }).summernote({
      height: 300,
      placeholder: 'Paste content here...',
      codemirror: { 
        theme: 'monokai'
      }
    });

var markupStr = 'hello world';
$('#summernote').summernote('code', markupStr);