Question

我是棱角分明的新人，不确定我是否正确地写了我的问题。这是问题所在。我从包含所有标签的数据库中收到一个html块

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

它无法帮助，我无法控制数据库中的任何内容，这是我收到的并且必须与之合作。

我在角色网格中呈现此信息的角度代码。我创建了指令，用于在我的网格中的特定列中编写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，但是它会抛出错误。虽然它在我的代码中适用于我。

Answer 1

为了定义指令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");
        }
    };
});

Answer 2

问题是第二个指令在页面加载后立即触发，并没有给kendo提供时间来呈现html。这纯粹是一个时间问题。添加$ timeout依赖项解决了这个问题。

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

2 个答案: