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

回答

相關問題