时间戳

首页 > 解决方案 > 在 Angular 6 中重用 ngx admin 中的组件

angular - 在 Angular 6 中重用 ngx admin 中的组件

问题描述

我正在使用NGX Admin并且我被困在重用组件上。我正在尝试在仪表板中使用智能表和饼图，但出现模板解析错误。我所做的是在dashboard.module 中添加了模块引用

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 { }

然后在 Dashboard.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 { }

然后最后在 html 文件中我添加了标签

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

但我收到模板解析错误。无法识别标签。有人可以告诉我我在这里做错了什么。

标签： angularangular6ngx-datatableng2-smart-table

解决方案

在您的 module.ts 文件中，在导入中添加“Ng2SmartTableModule”，并在组件 html 中添加标签。在您的仪表板组件中，您只需导入 ng2-smart-table 的属性，例如 LocalDataSource - import { LocalDataSource } from 'ng2-smart-table';- 以实例化源并将数据加载到表中。

推荐阅读