AngularJS Verzögerung kompilieren Richtlinie, bis Element sichtbar ist

Question

Ich habe eine Winkelanweisung, die eine jVectorMap rendert.

Wenn die Seite geladen wird, ist die Karte versteckt, aber der Benutzer auf einen Link klicken, können in einer die Karte zeigen fancyBox

Es ist völlig in Ordnung, in Chrome und IE funktioniert, aber Firefox bei mir schreit beim Rendern SVG auf einem verborgenen Element (i erhalten NS_ERROR_FAILURE) (siehe this question)

So auf der Grundlage dieses question, ich versuche meine Karte-Richtlinie zu bekommen, um nicht zu machen/kompilieren, bis es sichtbar ist, was ich denke, behebt das Problem in Feuerfuchs.

Gibt es eine Möglichkeit, dies zu tun, oder mache ich das falsch?

DANKE !!

aktualisieren

Mit ng-iftut Arbeit, aber in jVectorMap kann der Benutzer Regionen und Markierungen auf der Karte auswählen. Ich möchte, dass diese Auswahl auch nach dem Schließen der fancyBox erhalten bleibt. ng-if entfernt die Karte alle zusammen.

Richtlinie

angular.module('myApp') 
    .directive("selectionMap", electionMap); 

    function selectionMap(){ 
     return { 
      restrict: "E", 
      link : function(scope,element){ 
       jVectorMapOptions = { 
        // set jvm options (http://jvectormap.com/documentation/javascript-api/jvm-map/) 
        option : 'something', 
        option2: 'something else' 
        // and so on 
       }; 
      element.vectorMap(jVectorMapOptions); 

      } 
     } 
    } 

Wie kann ich die Richtlinie in html verwenden:

<div id="mapModal" ng-show="mapSelected"> 
    <selection-map id="myMap"></selection-map> 
</div> 

Die mapModal div zeigt in einem fancybox-2 modal.

Answer 1

Verwenden Sie ng-if anstelle von ng-Show. Dies erstellt die HTML-Elemente auf der Seite, wenn die Bedingung erfüllt ist, und entfernt sie, wenn dies nicht der Fall ist.