angularjs – 奇怪的ngIf $编译行为

我正在尝试构建一个将执行以下操作的指令：

>向元素添加另一个指令(例如,ngSwipeRight)
>添加一些自定义行为到新的指令.

一个例子是：mySwipeBack将添加ngSwipeRight,当用户刷新我将做history.back()的元素.

我试过这样：

.directive('swipe',function($compile){
  return {
    restrict: 'A',compile: function(el){
        // I removed all the actual logic for demo purposes
        // here I would add ng-swipe-right plus a handler
        el.removeAttr('swipe');
        var fn = $compile(el);
        return function (scope) {
          fn(scope);
        };
   }
 }
});

但是我遇到了以下标记的问题：

<div ng-if='true'>
  <h1 swipe>OUTSIDE
    <div ng-if="true">INSIDE</div>
  </h1>
</div>

“INSIDE”文本不会呈现.
你可以看到这个jsbin的行为：http://jsbin.com/tokofevuga/edit?html,output

如果我删除第一个ng-if,它按预期工作.

有谁知道这是什么原因 – 如果我能使它工作？

或者如果有人有另一个想法,如何实现我上面描述的内容？

return function (scope) {
      $compile(el)(scope);
    };

为我工作关键是在你的代码中,你可以在编译中立即编译元素,而这里的函数从编译中返回,这将在稍后执行.

原文地址：https://www.jb51.cc/angularjs/142847.html