angularjs指令的'$元素'是一个注释，因为ng-if

我正在为我的angularjs应用程序构建一个弹出式（对话框）指令。（仍然很多待办事项...）但是，我做了一个模板文件，它建立了弹出式元素，并通过从指令元素传递的属性插入值。

的事情是，我在该模板几个NG-IFS在范围检查的属性的不同值，比如

<!-- ngIf: active -->

前后的相关要素后

然后插入的角度评论。 所以我得到的意见，而不是在控制器的$ element参数中的实际元素！

为什么is'nt角色跳过那里的评论？我怎么能克服？

我的模板代码（popup_template.html）：

<div class="{{className}}" ng-if="active" style="{{popupStyle}}" ng-keyup="closeByEscape($event)"> 
    <div class="vex-overlay" style="{{overlayStyle}}"></div> 

    <div class="vex-content" style="{{contentStyle}}"> 
     <form class="vex-dialog-form" ng-if="type=='plain'"> 
      <div class="vex-dialog-message" ng-if="message!=null"> 
       {{message}} 
      </div> 
     </form> 
     <div ng-if="type=='advanced'" class="transcluded"> 

     </div> 
     <div class="vex-close" ng-if="showCloseButton" ng-click="close()"></div> 
    </div> 
</div>

现在我的角度代码：

app.directive('popup', ['popupfactory', '$timeout', function (popupfactory, $timeout) { 
return { 
    restrict: 'E', 
    replace: true, 
    templateUrl: 'popup_template.html', 
    transclude: true, 
    scope: false, 
    link: function (scope, element, attrs, $timeout) { 

     /* Declarations of all scope variables*/ 

     /*** Here, element is a comment! ***/ 

    }, 
    controller: ['$scope', '$element', '$attrs', '$transclude', '$http', function ($scope, $element, $attrs, $transclude, $http) { 

     /*** Here, $element is a comment! ***/ 

    }], 
}; 
}]);

我将是任何评论非常心存感激。

来源

2014-10-06 DebbieMiller

我怀疑你的指令会被执行，因为ngIf在所有运行之前运行，阻止所有其他指令被编译。你能分享演示吗？ – codef0rmer 2014-10-06 08:12:45

好吧，它确实符合要求，并且给出了期望的结果，但是只有在指令的编译和链接功能被执行之后。 Thanx无论如何:) – DebbieMiller 2014-10-06 09:35:10

我不知道我理解你的问题完全，但如果你想对这些元素的指示工作，我会建议使用ng-show和ng-hide代替ng-if，因为后者能真正与你通过申请任何事件处理程序螺丝指令。

随着ng-if节点的添加和删除从DOM（因此我猜插入喜欢到你的指令评论），而ng-show和ng-hide只是使节点通过造型看不见的，保留任何处理活着，让您操作内容容易。

来源

2014-10-06 08:14:13 kasoban

伟大的！这就是答案......使用ng-show，它真的会返回没有评论的完整对象！好的，如果你想要ng-if的DOM操作，那就不好了，但对我来说它是完美的。谢谢！从来没有想过这么简单...... :) – DebbieMiller 2014-10-06 09:36:40

angularjs指令的'$元素'是一个注释，因为ng-if

回答

相关问题