模拟子组件 Angular 2

在测试时如何模拟子组件？我有一个名为product-selected的父组件，其模板如下所示:

<section id="selected-container" class="container-fluid">
    <hr/>
  <product-settings></product-settings>
  <product-editor></product-editor>
  <product-options></product-options>
</section>

组件声明如下所示:

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

import { ProductSettingsComponent } from '../settings/product-settings.component';                                      
import { ProductEditorComponent }   from '../editor/product-editor.component';                                      
import { ProductOptionsComponent }  from '../options/product-options.component';                                        

@Component({
    selector: 'product-selected',
    templateUrl: './product-selected.component.html',
    styleUrls: ['./product-selected.component.scss']
})
export class ProductSelectedComponent {}

这个组件实际上只是其他组件居住的地方，可能不包含任何其他功能.

但当我设置测试时，我得到了以下模板错误，这对所有三个组件都是重复的:

Error: Template parse errors:
    'product-editor' is not a known element:
    1. If 'product-editor' is an Angular component, then verify that it is part of this module.
    2. If 'product-editor' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
        <hr/>
      <product-settings></product-settings>
      [ERROR ->]<product-editor></product-editor>

我试着加载子组件的模拟版本，但不知道怎么做-我看到的示例只是覆盖父组件，甚至没有提到子组件.那么我该怎么做呢？