Угловой 6 CoreUI и DatePicker

Question

Я использую CoreUI (угловая версия 6), чтобы создать простую панель.

Мне нужно иметь средство выбора даты, но я не могу найти, как это сделать.
Угловой материал может быть хорошим решением, но мне не удается его включить - похоже, есть некоторые основные конфликты.

Любое простое решение?

Answer 1

Вы устанавливаете пакет выбора даты и времени:

npm install - сохранить момент запуска загрузчика angular-bootstrap-datetimepicker open-iconic

// added the following to app.module.ts

import { AppComponent } from './app.component';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { NgModule } from '@angular/core';
import { DlDateTimePickerDateModule } from 'angular-bootstrap-datetimepicker';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    DlDateTimePickerDateModule,
  ],
  providers: [FormsModule],
  bootstrap: [AppComponent]
})
export class AppModule { }

//added the following to  app.component.html

<dl-date-time-picker
 startView="day"
 maxView="year"
 minView="minute"
 minuteStep="5"
 [(ngModel)]="selectedDate"
>
</dl-date-time-picker>

// added following to ./src/styles.css

@import '~bootstrap/dist/css/bootstrap.min.css';
@import '~open-iconic/font/css/open-iconic-bootstrap.css';

Answer 2

Можете добавить ngx-bootstrap, он имеет BootStrap DatePicker, совместимый с Bootstrap V3 и V4. Вы можете проверить это здесь: https://valor-software.com/ngx-bootstrap/

Чтобы установить ngx-bootstrap, запустите эту команду

ng add ngx-bootstrap  --component datepicker

Затем добавьте следующий код в ваш AppModule

import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';


@NgModule({
  imports: [BsDatepickerModule.forRoot(),...]
})
export class AppModule(){}

Пример использования (в шаблоне):

<input type="text" placeholder="Datepicker" class="form-control" bsDatepicker>