Angular 6 не работает с Bootstrap 3 Datepicker

Question

Я занимаюсь разработкой приложения Angular 6.Я начинаю создавать компонент с простым указателем даты.Я обязан использовать этот плагин: https://eonasdan.github.io/bootstrap-datetimepicker/

Даже если в файле "angular.json" я поставлю правильные зависимости .css и .js (css работает отлично; это скрипты .js):

            "scripts": [
          "src/jquery/jquery-3.1.1.min.js",
          "src/bootstrap/js/bootstrap.min.js",
          "src/bootstrap-datetimepicker/js/moment.min.js",
          "src/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"            
        ].

Мой шаблон HTML моего компонента такой:

<div class="form-group">
<label>Date</label>
<div class="input-group date" id="datetimepicker1">
    <input type="text" class="form-control field-8">
    <span class="input-group-addon">
        <span>today</span>
    </span>
</div>
</div>

<script type="text/javascript">
   $('#datetimepicker1').datetimepicker({ format: 'DD/MM/YYYY' });
</script>

Но если я нажму на кнопку, средство выбора даты не появится!(с нормальной HTML-страницей все работает отлично!).Как я могу решить эту проблему?Спасибо!

Answer 1

Я предпочитаю, пожалуйста, не используйте элемент JQuery с Angular 2+, вы можете найти такие же плагины / компонент для Angular 2+.Если вы хотите продолжить с этим, добавьте $('#datetimepicker1').datetimepicker({ format: 'DD/MM/YYYY' }); в метод ngAfterViewInit в файле component.ts.

Если это не сработает, добавьте это $('#datetimepicker1').datetimepicker({ format: 'DD/MM/YYYY' }); с временем ожидания.

ngAfterViewInitвыполнится, как только View будет загружен в Angular 2+.Я использую Primeng компонентов в моем проекте.