Я хочу использовать эту библиотеку https://bootstrap -datepicker.readthedocs.io / en / latest / markup.html # date-range в моем приложении.Но это должно быть угловым компонентом, поэтому впервые за свою короткую карьеру я хотел создать обертку библиотеки, но я думаю, что сделал что-то не так, потому что это не выглядит как оригинальный сборщик.
Вот как этодолжно выглядеть так: ![enter image description here](https://i.stack.imgur.com/Bkcl4.jpg)
А вот так выглядит мой угловой компонент:
![enter image description here](https://i.stack.imgur.com/K2Bv5.jpg)
Также, когда я хочу выбрать только месяц или год, это выглядит странно:
![enter image description here](https://i.stack.imgur.com/avmJV.jpg)
Хорошо, теперь пришло время увидеть мой код компонента:
import {AfterViewInit, Component, ElementRef, Input, OnInit} from
'@angular/core';
import 'bootstrap-datepicker';
declare var $;
@Component({
selector: 'cb-daterangepicker',
templateUrl: './daterangepicker.component.html',
styleUrls: ['./daterangepicker.component.scss']
})
export class DaterangepickerComponent implements OnInit, AfterViewInit {
@Input()
datepickerOptions: DatepickerOptions;
constructor(private elementRef: ElementRef) {
}
ngOnInit() {
}
ngAfterViewInit(): void {
// $(this.elementRef.nativeElement).datepicker();
$('.input-daterange input').each(function() {
$(this).datepicker('clearDates');
});
}
}
Как вы видите, например, нет выбора диапазона или просто даты начала и окончания, он просто выглядит иначе, поэтому я подумал, что это не загруженные стили, но я могу ошибаться.Мне нужна ваша помощь. Ребята, может быть, моя оболочка выполнена неправильно?
* Сетевая консоль со стилями:
![enter image description here](https://i.stack.imgur.com/OMa2g.jpg)
Стили надстроекto index.html и angular.json помогли с некоторыми вещами:
![enter image description here](https://i.stack.imgur.com/s003E.jpg)
Но все же диапазон между датами не подсвечивается ..