how to add custom button in summernote editor

Question

hello all,

 

I'm using angulat 10 in that I'm facing problem with summernote following code in...

 

html.

<textarea id="summernote1" class="summernote"></textarea>
<textarea id="summernote2" class="summernote"></textarea>
<textarea id="summernote3" class="summernote"></textarea>

component.ts

// Summer Note
$(".summernote").summernote({
height: 200,
toolbar: [
['style', ['bold', 'italic', 'underline', 'clear']]
]
});

Que.1.how to add Custom button in summernote toolbar and click event call(ex.(click)="function(content)") one function and open popup.

 

Que.2.how to find id (ex.summernote1) in click textarea.

 

Thanking you...