将ng-click事件附加到Angular Directive中的链接

Question

我有一个图表导航指令。在指令中，我将获得一个图表标题列表和一个服务网址，以获取图表所需的数据。一旦我得到图表对象的列表，我循环遍历列表并构建链接功能旁边的链接列表，并将此列表附加到模板中指定的Div。我能看到指令html，但我附加到链接的ng-click事件不起作用。这是我的指令的代码。

var ChartNavigationDirective = { 'ChartNavigation': function ($rootScope,$compile, RelatedItems) {
return {
    restrict: 'EA',
    require: '?ngModel',
    replace: false,
    template:  '<div class="chart-nav relatelink_hidden">' +
             ' </div>',
    scope: {
        options: '=ChartNavigation'
    },
    link: function (scope, element, attrs) {
        var source = scope.options.Source;
        scope.parseInt = parseInt;
        RelatedItems.getItems(scope.options.Source, scope.options.Type).then(function (d) {
            scope.links = d.Items;
            var myitems = scope.links;
            if (myitems.length > 0) {
                $(".chart-nav").removeClass("relatelink_hidden");
                var items = [];
                items.push('<ul>');
                for (var key in myitems) {
                    if (myitems.hasOwnProperty(key)) {
                        if (key == 0)
                            items.push('<li id="' + key + '" class="item_' + key + ' nav_selected">');
                        else {
                            items.push('<li id="' + key + '" class="item_' + key + '">');
                        }
                        var currentItem = parseInt(key) + 1;
                        var link = $('<a>' + currentItem + '</a>');
                        items.push('<a ng-click="setNavigation()">' + currentItem + '</a>');
                    }
                }
                items.push('</ul>');
                $(".chart-nav").html(items.join(''));                    
            }

        });
        scope.setNavigation = function () {
            alert("test");
        };
};
}
};

有人可以建议我在做错误吗？