2016-06-29 14 views
0

Ich habe eine Direktive in eckigen "spyStyle" Und ich möchte es so nutzbar wie möglich machen. Also ... Ich würde gerne verschiedene Callback-Funktionen aufrufen können, basierend auf was beobachtet wird.AngularJs Wie CallBack-Funktion basierend auf Watch-Wert zu ändern

Hier ist mein Code

.directive('spyStyle', [function() { 
     return { 
      link: function (scope, element, attrs) { 
       scope.$watch(function() { 
        return element.css(attrs['spyAttribute']); 
       }, styleChangedCallBack, true); 

       function styleChangedCallBack(newValue, oldValue) { 
        if (newValue !== oldValue) { 
         // do something interesting here 
        } 
       } 
      } 
     }; 

    }]); 
+0

Übergeben Sie den überwachten Wert, übergeben Sie den Rückruf. – tymeJV

+0

danke tymeJV, wie ich es unten gelöst habe, ist das ein richtiger Umgang mit den Dingen? Es scheint, dass ich nicht den gesamten Bereich schreiben sollte. $ Watch-Anweisung zweimal, nur um eine separate Callback-Funktion aufzurufen Konnte ich nicht einfach eine Variable der Callback-Funktion setzen und diese an die $ scope.watch-Anweisung übergeben? Weil, als ich es auf diese Weise versuchte, habe ich einen Fehler erhalten. – Acts7Seven

Antwort

0

Ich glaube, das es getan hat - ich habe die if-Anweisung bevor Sie die Armbanduhr Funktion auszuführen. Hat noch jemand einen anderen Vorschlag ???

   if ((attrs['spyAttribute']) = 'background-color') { 
        alert("background-color"); 
        scope.$watch(function() { 
         element.css('color', 'black'); 
         return element.css(attrs['spyAttribute']); 
        }, bgStyleChangedCallBack, true); 
       } else { 
        alert("something else"); 
        scope.$watch(function() { 
         //element.css('color', 'black'); 
         return element.css(attrs['spyAttribute']); 
        }, styleChangedCallBack, true); 
       } 

Hier ist der vollständige Code https://jsfiddle.net/acts7/5Ls46ebx/

Die vollständige Richtlinie überprüft die Hintergrundfarbe eines Elements und Änderungen Text lesbar werden. Es prüft dann, ob sich die Hintergrundfarbe ändert, und wendet bei Bedarf eine neue Textfarbe an.