Ich habe eine Anweisung zum Umschließen eines jQuery-Plugins erstellt und übermittele ein Konfigurationsobjekt für das Plugin vom Controller an die Direktive. (Werke)
Im Config-Objekt ist ein Callback, den ich bei einem Event aufrufen möchte. (Werke)
Im Callback möchte ich eine Eigenschaft im $ scope des Controllers ändern, die nicht funktioniert . Angular erkennt nicht, dass sich die Eigenschaft aus irgendeinem Grund geändert hat, was zu der Annahme führt, dass sich der $ scope im Callback vom $ scope des Controllers unterscheidet. Mein Problem ist einfach nicht warum.
Kann mir jemand in die richtige Richtung zeigen?
app.js
%Vor%html
%Vor% In Ihrer Demo gibt es eine Reihe von Problemen mit dem Umfang. Erstens wird innerhalb des Callbacks dateChange , obwohl die Funktion selbst innerhalb des Controllers deklariert ist, der Kontext von this innerhalb des Callbacks das Bootstrap-Element sein, da es sich in einem Bootstrap-Handler befindet.
Immer wenn Sie Winkelbereich-Werte aus Drittanbieter-Code ändern, muss angular darüber informiert werden, indem Sie $apply verwenden. Im Allgemeinen sollten alle Bereiche von Drittanbietern innerhalb der Richtlinie enthalten sein.
Eine etwas kantigere Methode ist die Verwendung von ng-model für die Eingabe. Verwenden Sie dann $.watch für Änderungen am Modell. Dies hilft dabei, den gesamten Code innerhalb des Controllers im eckigen Kontext zu halten. Es ist in jeder eckigen Anwendung selten, ng-model nicht auf Formularsteuerelementen zu verwenden
Innerhalb der Direktive:
%Vor%Dann im Controller:
%Vor%Demo: Ссылка
BEARBEITEN Ein weiteres Element, das geändert werden sollte, ist var dateInput = angular.element('.datepicker') entfernen, wenn Sie diese Anweisung für mehr als ein Element in der Seite verwenden möchten. Es ist überflüssig, in Direktiven verwendet zu werden, wobei element bereits eines der Argumente im link Callback ist und instanzspezifisch ist. Ersetzen Sie dateInput durch element
Das Ereignis changeDate, das an die Eingabe gebunden ist, scheint so eingerichtet zu sein, dass es außerhalb des Angular-Frameworks ausgelöst wird. Um den Absatz anzuzeigen, rufen Sie $scope.$apply() auf, nachdem Sie dateChanged auf true festgelegt haben. Um den Absatz nach der Verzögerung auszublenden, können Sie $apply() erneut in der Funktion verwenden, die an setTimeout übergeben wurde, aber Sie werden wahrscheinlich keine weiteren Probleme mit Angulars $timeout() statt.
Tags und Links angularjs angularjs-directive angularjs-scope