2016-11-07 55 views
1

一個模板指令我有2個組件, 1)Table.component 2)Dashboard.component如何包括在angular2

我想用表格模板在儀表板組件和我宣佈選擇素TOR在表組件中作爲

selector: '[tables-basic]', 

table.template中是否包含任何內容?

我進口儀表板模塊表成分,我聲明瞭組件的名稱,把選擇的儀表板組件作爲

<tables-basic></tables-basic> 

但我得到了錯誤的

1. If 'tables-basic' is an Angular component, then verify that it is part of this module. 
2. If 'tables-basic' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("  <div id="tabs2c" class="tab-content bg-info-light"> 
      <div id = "tab2"> 
      [ERROR ->]<tables-basic></tables-basic> 
       </div> 
<!--  

難道我錯過任何事情。任何人都可以請建議幫助。 我的UIElement module.ts,

import { CommonModule } from '@angular/common'; 
import { FormsModule,ReactiveFormsModule } from '@angular/forms'; 
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 
import { RouterModule } from '@angular/router'; 
import { AlertModule, TooltipModule } from 'ng2-bootstrap/ng2-bootstrap'; 
import { ButtonsModule, DropdownModule, PaginationModule } from 'ng2-bootstrap/ng2-bootstrap'; 
import { DataTableDirectives } from 'angular2-datatable/datatable'; 
import { Ng2TableModule } from 'ng2-table'; 
import { HttpModule } from '@angular/http'; 
import { WidgetModule } from '../layout/widget/widget.module'; 
import { UtilsModule } from '../layout/utils/utils.module'; 
import { JqSparklineModule } from '../components/sparkline/sparkline.module'; 
import 'parsleyjs'; 
//import { TablesBasic } from './basic/tables-basic.component'; 
import { TablesDynamic } from './dynamic/tables-dynamic.component'; 
import { SearchPipe } from './dynamic/pipes/search-pipe'; 
import {Ng2PaginationModule} from 'ng2-pagination'; 


export const routes = [ 
    {path: '', redirectTo: 'basic', pathMatch: 'full'}, 
    // {path: 'basic', component: TablesBasic}, 
    {path: 'dynamic', component: TablesDynamic}, 
]; 

@NgModule({ 
    declarations: [ 
    // Components/Directives/ Pipes 
    DataTableDirectives, 
    // TablesBasic, 
    TablesDynamic, 
    SearchPipe 
    ], 
    imports: [ 
    CommonModule, 
    Ng2PaginationModule, 
    HttpModule, 
    ReactiveFormsModule, 
    JqSparklineModule, 
    FormsModule, 
    AlertModule, 
    TooltipModule, 
    ButtonsModule, 
    DropdownModule, 
    PaginationModule, 
    WidgetModule, 
    UtilsModule, 
    Ng2TableModule, 
    RouterModule.forChild(routes) 
    ], 
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ] 
}) 
export default class UiElementsModule { 
    static routes = routes; 
} 
+0

在這裏分享你的模塊文件代碼。 – ranakrunal9

+1

['tables-basic'的可能重複是一個Angular組件,然後驗證它是這個模塊的一部分](http://stackoverflow.com/questions/40458135/tables-basic-is-an-angular-component-然後驗證它是這個模塊的一部分) – Sefa

回答

1

要麼改變選擇器

selector: 'tables-basic', 

或元件

<div tables-basic></div tables-basic> 

(其中div可以是任何元件)

selector: '[tables-basic]',是一個屬性選擇器,需要一個墊子ching屬性不是元素名稱。

+0

看來我犯了一個錯誤,我改變了選擇器,然後我面臨這個錯誤 – Arnold

+0

錯誤:類型TablesBasic是2個模塊的聲明的一部分:AppModule和UiElementsModule!請考慮將TablesBasic移動到導入AppModule和UiElementsModule的較高模塊。 – Arnold

+0

爲該指令創建一個新的'NgModule',將該指令添加到新'NgModule'的'declarations:[]'和exports:[]',然後將這個模塊添加到'imports:[MySharedModule]'中模塊你想使用它的地方。您不能將組件,指令或管道添加到多個模塊的'聲明:[]'。 –