在 ng-if 的另一个指令中编译指令

Question

我在 plnkr 中创建了一个示例： http://plnkr.co/edit/kcclSc10nPB8Qzm3qr7s?p=preview

在那里你可以看到有一个指令在编译函数中添加另一个指令，如果父div 上没有ng-if，它可以很好地工作。一旦ng-if 存在，第二个指令就不再起作用了。不过它适用于ng-show。

我的真实情况是我需要在一些按钮上添加一个工具提示。我们使用的工具提示是获取要显示的文本的指令。我们从后端收到的要显示的文本，基于一个键。因此，通过所有控制器调用服务以获取基于键的文本，然后将文本添加到范围并将其提供给工具提示指令，这不是一种选择。

其中一个按钮是 ok 按钮，atm 只是一个复选标记的图像。只有这个按钮出现在 72 个文件中，因此不能手动更改所有内容。因此，我在代码中查找了class="acceptbtn"，并将其替换为新的指令名称和class="acceptbtn"。所以现在所有的按钮都有我的指令来获取密钥。在我的指令中，我根据传递的键获取文本，然后将工具提示指令与我收到的文本一起添加到此元素中。

这在某些情况下效果很好。问题是如果有一个包装器div 和ng-if，它就不起作用。在所有这些文件中查找所有ng-ifs 也不是一个选项（除非没有其他选项）。

那么有没有办法解决这个问题？意思是，在 plnkr 中，第三个 div 应该看起来像第二个。 谢谢

Answer 1

工作Plunkr

app.directive('dir1', function($compile){
return{
    restrict: 'A',
    link: function(scope, element, attrs) {
         element.removeAttr('dir1');
         element.attr('dir2', '');
         $compile(element)(scope);
      }
}
});

app.directive('dir2', function($compile){
return {
    restrict: 'A',
    link: function(scope, element, attrs) {
       element.removeAttr('dir2');
       element.attr('style', "width:400px");
       $compile(element)(scope);
    }
    };
});

我使用链接功能稍微修改了您的指令。我个人只在我的指令模板发生运行时更改时才使用编译。