Question

我在我的angular 2项目中添加了summernote插件，并且我使用的是ng2admin主题，而不是使用angular CLI。那么如何在我的项目中添加summernote编辑器？

我试图将summernote css和js文件包括在index.html文件中。

index.html文件

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote.js"></script>

editor.html文件

<div id="summernote">Hello Summernote</div

editor.component.ts

ngOnInit(){
  $('#summernote').summernote();
}

错误：“ $（...）。summernote不是函数”。

Answer 1

您应该使用ngAfterViewInit钩子。在ngOnInit内部，该组件的HTML元素尚不存在：

ngAfterViewInit() {
  $('#summernote').summernote();
}

如何在Angular ng2admin主题中添加summernote插件

1 个答案: