Bootstrap-Datepicker in AngularJs implementieren

Question

Ich beginne mit AngularJs.

Ich muss "N" -Kalender in einem Formular implementieren. Ich bin mit Bootstrap-Datepicker (https://eonasdan.github.io/bootstrap-datetimepicker/)

Es funktioniert gut, wenn ich die inputTextId zum Beispiel

Html angeben:

<input id='datetimepicker2' data-ng-model="vm.search.origin.from" data-ng-click="vm.showCalendar(this)" class="form-control" type="text" placeholder="MM/DD HH:MM"> 

<input data-ng-model="vm.search.origin.to" data-ng-click="vm.showCalendar(this)" class="form-control" type="text" placeholder="MM/DD HH:MM"> 

Controller:

function showCalendar(obj) 
{ 
    $("#datetimepicker2").datetimepicker(); 
} 

Es funktioniert gut für ein inputText, und wenn ich es in mehr als einem implementieren will, muss ich jeden Namen und jede Funktion angeben. Ich möchte die Referenz übergeben und verwenden:

reference.datepicker(); oder so ähnlich, um nur eine Funktion zu erstellen. Ist das möglich?

Answer 1

Klingt, als ob Sie eine Direktive möchten. Nehmen Sie dies als Beispiel:

app.directive('timePicker', function() { 
    return { 
     link: function($scope, elem, attrs){ 
      $(elem).datetimepicker(); 
     } 
    } 
}); 

würden Sie dann fügen Sie einfach time-picker an die Eingänge Sie wollen.