解决方案

Question

我想知道是否有一种简单的方法来完成这种属性指令：

<p my-attr-directive="ABC">go to ABC</p>

应该在ui-router参数化链接中重新编译：

<p ui-sref="param_state({id:'ABC'})">go to ABC</p>

状态param_state已修复，新指令应定义参数id。

编辑：我差不多完成了，我不确定为什么$ compile，不编译

<a href="#" my-attr-directive="2a"> LINK!!</a>



app.directive('myAttrDirective', function($compile) {
     return {
        restrict: 'A',
        link: function($scope, el, $attrs) {
            $attrs.$set("uiSref","param_state({id:'"+$attrs.myAttrDirective+"'})");
            $compile(el.contents())($scope);

        }
    };
});

Answer 1

我差不多完成了，我不确定为什么$ compile，不编译

如果你检查了锚元素，你会看到类似下面的内容，

<span class="ng-scope">LINK!</span>

这意味着$compile完成了它的工作。在这方面，只需将元素的内容（即textNode＆＃39; LINK！＆＃39;）绑定到$scope。

因此，$compile 正在进行编译，但在搜索的任何地方都找不到您动态添加的指令uiSref。

 $compile(el.contents())($scope); // <== your directive exists as an attribute of `el` itself

解决方案

尝试编译主机element本身，因为您将uiSref指令添加为属性。此外，从元素中删除my-attr-directive属性非常重要，否则您最终将无限地编译锚元素：

link: function($scope, el, $attrs) {
    // make sure you don't recursively compile
    el.removeAttr('my-attr-directive');

    $attrs.$set("uiSref","param_state({id:'"+$attrs.myAttrDirective+"'})");
    $compile(el)($scope);  // <== here
}

指令'重新编译'到另一个

1 个答案:

解决方案

Working Demo