2015-07-07 5 views
7

Sto usando materiale angolare.Perché la didascalia md non è applicata alla scheda md dummy

Quando creo la mia direttiva e aggiungerlo al md-scheda-label, come

<md-tab-label> 
<custom-directive> 
Label 
</cutom-directive> 
</md-tab-label> 

Poi la direttiva personalizzato viene applicata a qualche "md-dummy-tab" anche.

Ma se io do mdtooltop al md-scheda-label, come

<md-tab-label> 
Label 
<md-tooltip>Label</md-tooltip> 
</md-tab-label> 

allora non c'è md-tooltip applicata a "md-dummy-tab" class

Ho provato a cercare dentro il codice mdtooltip, ma non riusciva a trovare alcun indizio.

https://github.com/angular/material/blob/master/src/components/tooltip/tooltip.js

Come posso fare lo stesso per la mia direttiva personalizzati, vale a dire la direttiva personalizzato non dovrebbe applicarsi alla scheda manichino md?

risposta

3

<md-tooltip> non viene aggiunto allo <md-dummy-tab> perché non esegue il rendering di alcun codice HTML all'interno dello <md-tab-label>. Il suo modello viene aggiunto al genitore più vicino <md-content> nel momento in cui si attiva il suggerimento da mostrare.

scope.$watch('visible', function (isVisible) { 
    if (isVisible) showTooltip(); 
    else hideTooltip(); 
    }); 

-

function showTooltip() { 
    // Insert the element before positioning it, so we can get the position 
    // and check if we should display it 
    tooltipParent.append(element); 

    // Check if we should display it or not. 
    // This handles hide-* and show-* along with any user defined css 
    if (hasComputedStyleValue('display','none')) { 
    scope.visible = false; 
    element.detach(); 
    return; 
    } 

    positionTooltip(); 
    angular.forEach([element, background, content], function (element) { 
    $animate.addClass(element, 'md-show'); 
    }); 
} 

-

current  = getNearestContentElement(), 
tooltipParent = angular.element(current || document.body) 

-

function getNearestContentElement() { 
    var current = element.parent()[0]; 
    // Look for the nearest parent md-content, stopping at the rootElement. 
    while (current && current !== $rootElement[0] && current !== document.body) { 
    current = current.parentNode; 
    } 
    return current; 
} 
+0

Essi guardano sopra la variabile visibile ambito. Ma come fanno a sapere quale elemento viene mostrato sullo schermo e quale elemento non lo è? Normalmente per verificare se l'elemento è visibile sullo schermo, dobbiamo controllare la sua proprietà display o controllare offsetHeight. Ma non stanno facendo nulla del genere nel loro codice. Quindi, come fanno a sapere della visibilità dell'elemento? – Santosh