代码之家  ›  专栏  ›  技术社区  ›  redOctober13

使用NgbDatepicker的角度单元测试失败

  •  5
  • redOctober13  · 技术社区  · 7 年前

    这看起来很简单,我肯定我没有在什么地方导入什么东西,但我已经尝试了所有模块,包括测试,但没有成功。测试失败,出现以下错误:

    没有将“exportAs”设置为“ngbDatepicker”的指令 (placeholder=“一年前”[(ngModel)]=“fromDate”ngbDatepicker[错误->]#fromDateToggle=“ngbDatepicker”title=“选择日期”>

    我有一个组件模板,它使用 ng-bootstrap 弹出窗口中的日期选择器(根据其 docs )

    我的模板代码如下所示:

    <div class="input-group">
      <input id="to-date" name="dp" class="form-control" placeholder="yyyy-mm-dd" name="dp" [(ngModel)]="toDate"
        ngbDatepicker #toDateToggle="ngbDatepicker" title="Select a date">
      <button class="input-group-addon" (click)="toDateToggle.toggle()" type="button">
        <span class="fa fa-calendar"></span>
      </button>
    </div>
    

    我有 NgbModule.forRoot() 在里面 app.module.ts 并已导入 NgbModule 在我的规范文件中 guide 要求。

    我的规范文件:

    import { async, ComponentFixture, TestBed } from '@angular/core/testing';
    import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
    import { By } from '@angular/platform-browser';
    import { NgbModule, NgbActiveModal, NgbDateStruct } from '@ng-bootstrap/ng-bootstrap';
    import { ExtractModalComponent } from './extract-modal.component';
    
    fdescribe('ExtractModalComponent', () => {
      let component: ExtractModalComponent;
      let fixture: ComponentFixture<ExtractModalComponent>;
      let debugEl: DebugElement;
    
      beforeEach(
        async(() => {
          TestBed.configureTestingModule({
            declarations: [ExtractModalComponent],
            providers: [NgbActiveModal],
            schemas: [NO_ERRORS_SCHEMA]
          }).compileComponents();
        })
      );
    
      beforeEach(() => {
        fixture = TestBed.createComponent(ExtractModalComponent);
        component = fixture.componentInstance;
        debugEl = fixture.debugElement.query(By.css('.modal-body'));
        fixture.detectChanges();
      });
    
      fit('should create component', () => {
        expect(component).toBeTruthy();
      });
    });
    
    1 回复  |  直到 7 年前
        1
  •  10
  •   lealceldeiro VonC    7 年前

    “我在app.module.ts中有NgbModule.forRoot()”

    .... 这与您的测试无关。您需要在规范文件中执行此操作

    例如 imports:[NgbModule.forRoot()]

    值得注意的是,您不必导入完整的 NgbModule i、 e:您可以导入 NgbDatepickerModule ... 但我会先让它工作,然后再修补这个