2017-07-02 78 views
0

我正在学习角,我的第一个业力测试抛出下面的错误。角业测试失败,自定义标记不知道元素

AppComponent should create component 
Error: Template parse errors: 
'ereturn-form' is not a known element: 
1. If 'ereturn-form' is an Angular component, then verify that it is part of this module. 
2. If 'ereturn-form' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<ereturn-form></ereturn-form>"): ng:///DynamicTestModule/[email protected]:0 

这是我的模块和组件

app.module.ts

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { ReactiveFormsModule } from '@angular/forms'; 
import { HttpModule, JsonpModule } from '@angular/http'; 
import { EreturnService } from './ereturn.service'; 

import { InMemoryWebApiModule } from 'angular-in-memory-web-api'; 
import { InMemoryDataService } from './in-memory-data.service'; 

import { AppComponent }   from './app.component'; 
import { EreturnFormComponent} from './ereturn-form.component'; 

@NgModule({ 
    imports:  [ BrowserModule, ReactiveFormsModule, HttpModule, JsonpModule, 
    InMemoryWebApiModule.forRoot(InMemoryDataService)], 
    declarations: [ AppComponent, EreturnFormComponent ], 
    bootstrap: [ AppComponent ], 
    providers: [ EreturnService ] 
}) 

export class AppModule { } 

app.component.ts

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: '<ereturn-form></ereturn-form>', 
}) 
export class AppComponent { } 

ereturn-form.component.ts

import { Component, OnInit, Input, OnChanges } from '@angular/core'; 

import { Ereturn } from './ereturn'; 
import { EreturnService } from './ereturn.service'; 
import { FormBuilder, FormGroup, Validators } from "@angular/forms"; 

@Component({ 
    selector: 'ereturn-form', 
    templateUrl: './ereturn-form.component.html' 
}) 

export class EreturnFormComponent implements OnInit { 
... 
} 

这是我的规格文件

describe('1st tests',() => { 
    it('true is true',() => expect(true).toBe(true)); 
}); 

为什么人缘抱怨自定义HTML代码?角度编译并运行它就好了。

非常感谢你

+0

哪里是规范文件的代码?更新到 – Aravind

+0

谢谢@Aravind,我只是添加了spec文件 –

+0

一行是不够的。添加您在模块创建spec文件时可能犯过错误的完整spec文件。 – Aravind

回答

1

如果你的元素是自定义组件,你应该把它添加到您的测试作为声明的一部分。

import { CustomElement } from '...your path here'; 
 

 
describe('AppComponent',() => { 
 
    beforeEach(() => { 
 
    TestBed.configureTestingModule({ 
 
     schemas: [ ], 
 
     declarations: [CustomElement], 
 
     imports: [RouterTestingModule] 
 
    }); 
 
    TestBed.compileComponents(); 
 
    });

如果你想忽略特定元素,您可以通过添加CUSTOM_ELEMENTS_SCHEMA到您的模式阵列忽略它:

beforeEach(() => { 
 
    TestBed.configureTestingModule({ 
 
     schemas: [ CUSTOM_ELEMENTS_SCHEMA ], 
 
     declarations: [], 
 
     imports: [] 
 
    });

,最后,如果它来自另一个库,则应添加它的模块测试:

import { CustomeModule } from 'module name here'; 
 

 
describe('AppComponent',() => { 
 
    beforeEach(() => { 
 
    TestBed.configureTestingModule({ 
 
     schemas: [ ], 
 
     declarations: [], 
 
     imports: [CustomeModule] 
 
    }); 
 
    TestBed.compileComponents(); 
 
    });