Question

我是Angular 5的新手，我下载了这个入门模板：

我有一个仪表板组件，我想在其中实现chartjs组件。

我的dashboard.module.ts：

import { DashboardPageComponent } from './dashboard-page.component';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

@NgModule({
    imports: [
        RouterModule.forChild([
            { path: '', pathMatch: 'full', component: DashboardPageComponent },
        ]),
    ],
    declarations: [DashboardPageComponent],
})
export class DashboardModule {}

这里是dashboard.component.html模板：

 <div class="container">
    <h1>Your Todo List</h1>
    <ul class="list-group">
        <p>test</p>
    </ul>

    // HERE I WANT TO USE THE CHART COMPONENT
    <line-chart-component></line-chart-component>
</div>

以下是折线图组件：

import { Component, OnInit } from '@angular/core';
import * as Chart from 'chart.js'

@Component({
    selector: 'line-chart-component',
    templateUrl: './line-chart.component.html'
})
export class LineChartComponent {
    constructor() { }
}

线条图html：

    <div class="container">
      <h1>TESTCOMPONENT</h1>
    </div>

图表模块：

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { LineChartComponent } from './line-chart.component';

@NgModule({
    declarations: [LineChartComponent],
    // export: [LineChartComponent],
})
export class LineChartModule {}

但是导出声明不能分配给“NgModule”类型的参数

如何在仪表板组件中使用图表组件？

Answer 1

它是exports而不是export：

@NgModule({
    declarations: [LineChartComponent],
    exports: [LineChartComponent],
})

Angular 5组件使用

1 个答案: