Reusing components in ngx admin in angular 6

Question

I am using NGX Admin and I am stuck at reusing components. I am trying to use smart table and pie charts inside the Dashboard but I am getting a template parse error. What I did was inside dashboard.module I added the module reference

import { NgModule } from '@angular/core';    
import { NgxEchartsModule } from 'ngx-echarts';

import { ThemeModule } from '../../@theme/theme.module';
import { DashboardComponent } from './dashboard.component';
import { TablesModule } from '../tables/tables.module';


@NgModule({
  imports: [
    ThemeModule,
    NgxEchartsModule,
    TablesModule    
  ],
  declarations: [
    DashboardComponent,
  ],
})
export class DashboardModule { }

and then in the Dashboard.component I imported the table component

  import {Component, OnDestroy} from '@angular/core';
import { NbThemeService } from '@nebular/theme';
import { takeWhile } from 'rxjs/operators/takeWhile' ;
import {SmartTableComponent} from '../tables/smart-table/smart-table.component'

@Component({
  selector: 'ngx-dashboard',
  styleUrls: ['./dashboard.component.scss'],
  templateUrl: './dashboard.component.html',
})
export class DashboardComponent { }

and then finally in the html file I added the tag

<ng2-smart-table>
</ng2-smart-table>

but I am getting a template parse error. The tag is not recognized. Can someone please tell me what I am doing wrong here.

Please, show your entire `dashboard.module`(in your post above, not in comments, please). — , Jul 30 '18 at 04:45
You could try to put the `TablesModule` also in the `exports[]` section of your `dashboard.module`. I had this to do to get my 18N work, for example. — , Jul 30 '18 at 04:59
You can make component and export as module then include it in your required module ts file. — Kishan, Jul 30 '18 at 08:00

score -1 · Answer 1 · answered Jan 16 '19 at 09:03

In your module.ts file add "Ng2SmartTableModule" in the imports and add tag in your component html. In your Dashboard component you just import properties of ng2-smart-table like LocalDataSource - import { LocalDataSource } from 'ng2-smart-table';- to instantiate a source and load your data in your table.

Reusing components in ngx admin in angular 6

1 Answers1