Question

我们正在做一个实施业力茉莉花单元测试的angular2项目。我们在HTML代码中使用了 splitString 过滤器。在spec文件中编写测试用例时，我们在cmd中收到以下错误。

运行ng test命令时出现以下cmd错误：

The pipe 'splitString' could not be found ("9 col-sm-8 quote--card-item">
                        <span class="quote--card-item-label">Roll No.</span>[ERROR ->] {{rollXRefKey | splitString: '/': 0}}
                    </div>
                    <!-- Get Full Quote Button ("): mynewComponentComponent@18:69
        Can't bind to 'error' since it isn't a known property of 'label'. ("overAmountSaveLabel" class="quote--content-item-label quote--cover-amount-save-label
 control-label" [ERROR ->]error="{{quoteSummary.formErrors.coverAmount}}">Cover Amount<span class="glyphicon glyphicon-asterisk"):mynewComponentComponent@64:154
        Error: Template parse errors:
        The pipe 'splitString' could not be found ("9 col-sm-8 quote--card-item">
                        <span class="quote--card-item-label">Roll No.</span>[ERROR ->] {{rollXRefKey | splitString: '/': 0}}
                    </div>
                    <!-- Get Full Quote Button ("): mynewComponentComponent@18:69
        Can't bind to 'error' since it isn't a known property of 'label'. ("overAmountSaveLabel" class="quote--content-item-label quote--cover-amount-save-label
 control-label" [ERROR ->]error="{{quoteSummary.formErrors.coverAmount}}">Cover Amount<span class="glyphicon glyphicon-asterisk"): mynewComponentComponent@64:154
            at TemplateParser.parse (webpack:///C:/OMSA/codebase/p1-iteration1/ui.apps/~/@angular/compiler/src/template_parser/template_parser.js:97:0 <- src/te
st.ts:16773:19)

以下文件是我们的my-new-component.html文件：

<form autocomplete="off" [formGroup]="quoteSummary.form" (ngSubmit)="addCoverAmount(quoteSummary.form.coverAmount)">
        <div class="row quote--card">
            <div class="col-md-9 col-sm-8 quote--card-item">
                <span class="quote--card-item-label">Roll No.</span> {{quoteXRefKey | splitString: '/': 0}}
            </div>

以下文件是my-new-component.component.spec.ts文件：

/* tslint:disable:no-unused-variable */
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';

import { RouterTestingModule } from '@angular/router/testing';
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
import { DummyService } from '../services/dummy.service';
import { ReactiveFormsModule} from '@angular/forms';
import { SplitPipe } from '../../common/pipes/string-split.pipe';

import { MyNewComponentComponent } from './my-new-component.component';

describe('MyNewComponentComponent', () => {
  let component: MyNewComponentComponent;
  let fixture: ComponentFixture<MyNewComponentComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports: [RouterTestingModule, NgbModule.forRoot(), ReactiveFormsModule],
      declarations: [ MyNewComponentComponent , SplitPipe],            
  providers: [DummyService]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MyNewComponentComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  }); 
});

以下文件是我们的my-new-component.component.ts文件：

  import { Component, OnInit } from '@angular/core';
import { Router, Routes, RouterModule } from '@angular/router';
import { DummyService } from '../services/dummy.service';

@Component({
  selector: 'app-my-new-component',
  templateUrl: './my-new-component.component.html',
  styleUrls: ['./my-new-component.component.css']
})
export class MyNewComponentComponent implements OnInit {

  constructor(private router: Router, private quoteService:QuoteService, public fb: FormBuilder) { }

  ngOnInit() {
  }
    redirect() : void{
        //this.router.navigate(['/my-module/my-new-component-1'])
    }
}

“错误：在编写Karma-Jasmine单元测试用例时，无法找到管道'splitString'

0 个答案: