angular-charts.js — линейная/гистограмма по шаблону всплывающего окна по клику

Я ищу лучший способ реализовать линейную/гистограмму во всплывающем окне click для отображения списка элементов на основе метки (ось X), на которую был нажат.

Моя текущая реализация в моем контроллере приложений выглядит так:

$scope.onClick = function (points, evt) {
    //console.log(points, evt);

    // length of points array is determined by how many series you have
    if (points.length > 0) {
        // call service to get some data based on label that was clicked on
        GetKVP.get({
            groupId: $scope.GroupId,
            type: $scope.Grouping,
            label: points[0].label, // label is the same no matter how many points you have
        }).$promise.then(
            function (data) {
                if (data.success) {
                    if (data.kvps.length > 0) {
                        var html = "<div class='temp popover' style='display: block; position: absolute; top: " + evt.pageY + "px; left: " + evt.pageX + "px;'><div class='popover-inner'><h3 class='popover-title'>KVPs</h3><div class='popover-content'>";
                            angular.forEach(data.kvps, function (val, key) {
                                html += "<a class='' data-ng-click='OpenKVP(" + val.Id + ")'>" + val.Name + "</a><br>";
                            });
                            html += "</div></div></div>";
                            $("div.app-container").append(html);
                        } else {
                            // do nothing
                        }
                    }
                }, function (error) {
                    // report that error has occured
                });
    }

    // remove popover after 30 seconds
    //todo: this needs a better implementation as it doesn't take into account how long it takes to fetch the data
    $timeout(function () {
        $("div.temp").remove();
    }, 30000); // deafult delay is 0 milliseconds
};

Подводя итог, когда пользователь нажимает на диаграмму, мое приложение извлекает список элементов, соответствующих метке, и отображает его во всплывающем окне.

Моя проблема в том, что когда я нажимаю на элемент в этом всплывающем окне, привязка ngClick не срабатывает. Это заставляет меня поверить, что я неправильно привязываю свой шаблон всплывающего окна.

Я мог бы что-то сделать с jQuery, но тогда зачем мне вообще использовать angular; Правильно?

В качестве альтернативы я мог бы создать частичный/встроенный шаблон, который будет корректно связываться. Но с этой реализацией я не знаю, как создавать несколько всплывающих окон при каждом щелчке.

Ссылка:
AngularJS — сценарий
angular-chart.js
Начальная загрузка пользовательского интерфейса — всплывающее окно


Обновление:
я наткнулся на этот ответ, в котором предлагалось использовать $compile. При этом angular анализирует html, который, в свою очередь, связывает мой файл ngClick.

В результате в приведенном выше коде произошли следующие изменения:

$("div.app-container").append($compile(html)($scope));