Bootstrap-datepicker не обновляет модель AngularJS при выборе даты

Я использую AngularJS с этот плагин bootstrap-datepicker:

Datepicker для Bootstrap v1.6.4 (https://github.com/eternicode/bootstrap-datepicker)

Copyright 2012 Stefan Petre

Усовершенствования Andrew Rowls

Я связал это так:

<input type="text" data-provide="datepicker" ng-model="obj.FirstDate" />

Я получаю значения на входы с помощью ng-model.

Когда я ввожу дату в это поле с помощью клавиатуры, все работает нормально, но когда я нажимаю на поле и выбираю дату из Datepicker:

модель не обновляется,
поле не рассматривается как грязное (класс ng-dirty).

Есть ли способ сообщить Angular обновить значение obj.FirstDate при использовании Datepicker? Например, чтобы прикрепить его к событию? Или каким-либо другим способом это будет работать?

У меня есть несколько таких полей, поэтому я не хочу писать script, который прикрепляется к полю, используя его id. Любая помощь была оценена.

Ответ 1

После долгих попыток борьбы с этим я был вынужден использовать нижеприведенный код, чтобы исправить каждый из моих экземпляров datepicker сразу:

function fixDatepickerTriggerChange() {
    $(document).ready(function () {
        $('[data-provide="datepicker"]').datepicker().on('changeDate', function (e) {
            angular.element($(this)).triggerHandler('input');
        });
    });
}

И запустите его из angular.controller.

На основе этого ответа: fooobar.com/questions/44107/....

Ответ 2

Не зная больше, я думаю:

... если вы измените любую модель вне контекста Angular, тогда вы необходимо сообщить Angular об изменениях, вызвав $apply() вручную. Это как сказать Angular, что вы меняете некоторые модели, и это должен стрелять наблюдателей, чтобы ваши изменения распространялись правильно.

Источник: https://www.sitepoint.com/understanding-angulars-apply-digest/

Вот директива для этого конкретного datepicker: https://github.com/fkammer/ng-eternicode-datepicker