TypeScript theme.NbDatepickerDirective类代码示例

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

本文整理汇总了TypeScript中@nebular/theme.NbDatepickerDirective类的典型用法代码示例。如果您正苦于以下问题：TypeScript NbDatepickerDirective类的具体用法？TypeScript NbDatepickerDirective怎么用？TypeScript NbDatepickerDirective使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。

在下文中一共展示了NbDatepickerDirective类的2个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: describe

describe('nb-datepicker', () => {
  let fixture: ComponentFixture<NbDatepickerTestComponent>;
  let appRef: ApplicationRef;
  let datepicker: NbDatepickerComponent<Date>;
  let datepickerDirective: NbDatepickerDirective<Date>;
  let overlay: HTMLElement;
  let input: HTMLInputElement;

  const showDatepicker = () => {
    datepicker.show();
    appRef.tick();
  };

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [
        RouterTestingModule.withRoutes([]),
        NbThemeModule.forRoot(),
        NbLayoutModule,
        NbDatepickerModule.forRoot(),
      ],
      declarations: [NbDatepickerTestComponent],
    });

    fixture = TestBed.createComponent(NbDatepickerTestComponent);
    appRef = TestBed.get(ApplicationRef);

    fixture.detectChanges();
  });

  beforeEach(() => {
    datepicker = fixture.componentInstance.datepicker;
    datepickerDirective = fixture.componentInstance.datepickerDirective;
    overlay = fixture.nativeElement.querySelector('nb-layout');
    input = fixture.nativeElement.querySelector('input');
  });

  it('should render calendar', () => {
    showDatepicker();
    const calendar = overlay.querySelector('nb-calendar');
    expect(calendar).toBeTruthy();
  });

  it('should not render overlay on load', () => {
    const datepickerContainer = overlay.querySelector('nb-datepicker-container');
    expect(datepickerContainer).toBeNull();
  });

  it('should render overlay lazily', () => {
    const datepickerContainer = overlay.querySelector('nb-datepicker-container');
    expect(datepickerContainer).toBeNull();
    showDatepicker();
    const calendar = overlay.querySelector('nb-calendar');
    expect(calendar).toBeTruthy();
  });

  it('should write selected date in the input', () => {
    const date = new Date(2018, 8, 17);
    datepicker.visibleDate = date;
    showDatepicker();

    datepicker.dateChange.subscribe(e => {
      expect(e).toEqual(date);
      expect(input.value).toEqual('Sep 17, 2018');
    });

    const cell = overlay.querySelectorAll('.day-cell')[22]; // it's visible date cell
    cell.dispatchEvent(new Event('click'));
  });

  it('should start from date typed into the input', () => {
    input.value = 'Sep 17, 2018';
    input.dispatchEvent(new Event('input'));
    showDatepicker();
    appRef.tick();

    const cell = overlay.querySelector('.day-cell.selected'); // it's input value date cell

    expect(cell.textContent).toContain('17');
  });

  it('should start from current date if input is empty', () => {
    showDatepicker();
    appRef.tick();
    expect(overlay.querySelector('.day-cell.today')).toBeDefined();
  });

  it('should start from current date if input value is invalid', () => {
    input.value = 'definitely not a date';
    input.dispatchEvent(new Event('input'));
    showDatepicker();
    appRef.tick();
    expect(overlay.querySelector('.day-cell.today')).toBeDefined();
  });

  it('should update visible date if input value changed', () => {
    const initialDate = new Date(2000, 0, 1);
    datepicker.visibleDate = initialDate;

    const date = 17;
//.........这里部分代码省略.........

开发者ID:kevinheader，项目名称:nebular，代码行数:101，代码来源:datepicker.spec.ts

示例2: it

  it('should not be valid if empty contain incorrectly formatted date', () => {
    input.value = 'somecurruptedinput';
    input.dispatchEvent(new Event('input'));
    showRangepicker();

    expect(datepickerDirective.validate()).not.toBe(null);
  });

开发者ID:kevinheader，项目名称:nebular，代码行数:7，代码来源:datepicker.spec.ts

注：本文中的@nebular/theme.NbDatepickerDirective类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。