Quickly add html to the controller-bound layout

Question

I may not be able to provide the correct title for the question, but for me I need to add this piece of html to my layout dynamically and activate its click events using the controller.

<div id="subscriber1" class="participant-video-list" >
                                <div class="participant-call-controls-div">
                                    <div data-id="vm.participantId" ng-click="vm.maximizeParticipant($event)">Maximize</div>
                                    <div data-id="vm.participantId" ng-click="vm.minimizeParticipant($event)">Minimize</div>
                                </div>
                            </div>

Is it possible? If so, how can I achieve this.

Thanks in advance.

Answer 1

You can use the directive ng-include. This directive may include HTML from an external file.  An explanation can be seen here.

For instance:

<ng-include src="template"></ng-include>

An example of work in plunker (not mine).