繁体   English   中英

Angular 5组件用法

[英]Angular 5 component usage

我是Angular 5的新手,我下载了此入门模板:

Angular 5-Firebas入门模板

我有一个仪表板组件,我想在其中实现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() { }
}

和linechart 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”类型的参数

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

这是exports而不是export

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM