如何让AngularJS指令更新由另一个指令生成的锚点

How to have a AngularJS directive update the anchors generated by another directive

本文关键字：指令 另一个 AngularJS 更新      更新时间：2023-09-26

我对angular很陌生，不确定我的问题措辞是否正确。这就是问题所在。我从一个数据库收到一块html，所有标签都包括

<DOCTYPE>
 <html>
     <head>...</head>
     <body>...</body>
 </html>

这是没有帮助的，我无法控制DB中的任何东西，这是我收到的，也是我必须处理的。

我的角度代码在剑道网格中呈现这些信息。我创建了一些指令来编写和呈现网格中特定列中的HTML。

myDirectives.directive('column', function(){
    return{
        restrict: 'E',
        scope: {
            value: '=',
            text: '=',
        },
        replace: true,
        template: <div><span target-blank>[template html to render to column in the grid]</span></div>,
        link: function(scope, element, attrs){
            // code to do stuff 
        }
    }
}

我还创建了另一个指令：

myDirectives.directive('target-blank', function () {
    return {
        restrict: 'A',
        replace: false,
        compile: function (element) {
            var elems = (element.prop("tagName") === 'A') ? element : element.find('a');
            elems.attr("target", "_blank");
        }
    };
});

我试图完成的是检查返回的HTML中的每个锚点，并使锚点在一个新窗口中打开。列HTML完美呈现，没有任何问题，然而，锚仍然在同一个选项卡中打开，而不是在新的选项卡中打开。我做错了什么？提前谢谢。

更新1:@dfsq，这是我更新的测试链接[http://plnkr.co/edit/WVkLDjhAzRxuS1A7mPg0?p=preview]我试着在这里使用ng-bind-html，但它抛出了错误。不过，它在我的代码中对我有效。

为了定义指令target-blank，您需要遵循JS:中的camelCase表示法

myDirectives.directive('targetBlank', function () {
    return {
        restrict: 'A',
        replace: false,
        compile: function (element) {
            var elems = (element.prop("tagName") === 'A') ? element : element.find('a');
            elems.attr("target", "_blank");
        }
    };
});

问题是第二个指令在页面加载后立即启动，而没有给kendo呈现html的时间。这纯粹是时间问题。添加$timeout依赖项解决了问题。

相关文章：