我正在尝试为我的 angularjs 应用程序构建一个弹出(对话框)指令。(还有很多待办事项......)但是我制作了一个模板文件,它构建了弹出元素,并插入了与指令元素一起传递的属性中的值。
问题是,我在该模板中有一些 ng-ifs 用于检查范围内属性的不同值,然后 angular 插入注释,例如
<!-- ngIf: active -->
前后相关元素。所以我在控制器的 $element 参数中得到注释而不是实际元素!
为什么没有角度跳过那里的评论?我怎么能克服呢?
我的模板代码(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! ***/
}],
};
}]);
我会非常感谢任何评论。