Angular 7 popover loading

Question

I am using fabricjs to load image and textcontents.

I have many textcontents on canvas with fabricjs.

now on click of textcontents of fabricjs I want to open Angular 7 popover may be (ngbPopover).

how to open that on click of textcontents, like we are opening dialogbox?

because I can not inject popover config anywhere in fabricjs.

Answer 1

Actually I was trying to say something like this, And I found solution here.

const showImageTools = (e) => {
                                    const content = '<div id="imageDialog" class="container">\n' +
                                        '        <mat-form-field class="example-full-width">\n' +
                                        '            <input value="' + pngText.texts + '" id="textInputField" style="width: 400px;\n' +
                                        '    box-shadow: 2px 4px 5px 3px #bdc3bdee;height: 50px;\n' +
                                        '    padding: 5px;\n' +
                                        '    border-radius: 5px;" matInput placeholder="Add your texts"/>\n' +
                                        '        </mat-form-field>\n' +
                                        '    </div>';
                                    $("body").append(content);
                                    moveImageTools();
                                };

                                this.canvas.add(pngText).renderAll();
                                pngText.on('mousedown', event => {
                                    showImageTools(event);
                                });