Formatierungsformular-Eingabefeld entbindet mein ng-Modell - javascript, jquery, forms, angularjs

Ich habe ein Formular, das ich mit winkligem JS einreichen möchte

Eines der Felder erfordert die Erstellung eines äthiopischen Kalenders. Daher verwende ich eine externe Javascript-Bibliothek, um dieses Datum anzuzeigen - hier verfügbar http://keith-wood.name/calendarsRef.html

Um die Datumsauswahl anzuzeigen, wird ein Eingabetext wie folgt erstellt:

<input type="text" id="ethiopianDOB" ng-model="Ethiopian"

Und entsprechendes Javascript

$( "#ethiopianDOB" ).calendarsPicker({
calendar: $.calendars.instance("ethiopian")
});

Dies stört jedoch meine Bindung an das ng-model und kann daher nicht auf meine Variable in $ scope zugreifen (ich habe das Objekt bei der Formularübergabe überprüft und ich habe kein Element wie $ scope.Ethiopian

Ich suche nach Möglichkeiten entweder
1. Behalten Sie die Bindung des ng-Modells ODER bei
2. Sie benötigen kein Javascript, um den Kalender zu instanziieren ODER
3. Verbesserung meiner Herangehensweise an dieses Problem

Vielen Dank

Antworten:

Sie sollten JQuery und Angular möglichst nicht mischen. Versuchen Sie, "in eckig zu denken", anstatt auf JQuery zurückzugreifen.

Hier ist ein toller Beitrag zu diesem Thema: "Thinking in AngularJS" wenn ich einen jQuery Hintergrund habe?

Davon abgesehen, sollten Sie versuchen, das zu ersetzenJQuery-Kalender mit einer eckigen Direktive wie dem Datepicker von Angular UI Bootstrap. Ich weiß nicht, ob sie einen ethopischen Kalender haben, aber Sie könnten immer Ihren eigenen Kalender erstellen.

Dies würde Ihr Problem beheben.

Hoffe das hilft.