Add ChartsModule into your ChartsNg2Module class. charts.module.ts would look like this

import {NgModule} from '@angular/core';               
import { ChartsModule } from 'ng2-charts';
import { ChartsComponent } from './charts/charts.component';

@NgModule({
imports: [ChartsModule],
declarations: [ChartjsComponent],
providers: [ ],                       
})
 export class ChartjsModule {

 }
        

import chartjs data file from shared folder in ChartjsComponent class. charts.component.ts would look like this

import { Component } from '@angular/core';
import * as chartsData from '../../../../../assets/data/chartJs/chartjs';

@Component({
    selector: 'app-chartjs',
    templateUrl: './charts.component.html'                         
})
            
export class ChartsComponent implements OnInit {

    // lineChart
        public lineChartData = chartsData.lineChartData;
        public lineChartLabels = chartsData.lineChartLabels;
        public lineChartOptions = chartsData.lineChartOptions;
        public lineChartColors = chartsData.lineChartColors;
        public lineChartLegend = chartsData.lineChartLegend;
        public lineChartType = chartsData.lineChartType;

    // events
    public chartClicked(e: any): void {
        console.log(e);
    }
    
    public chartHovered(e: any): void {
        console.log(e);
    }

}
            

charts.component.html would look like this

                
                <canvas height="400" baseChart class="chart" [datasets]="lineChartsData" [labels]="lineChartsLabels"
                [options]="lineChartsOptions" [colors]="lineChartsColors" [legend]="lineChartsLegend"
                [chartType]="lineChartsType"> > </canvas>
                                    

export const lineChartData: Array = [
        { data: [56, 70, 55, 46, 67, 52, 70], label: 'Series C' },
        { data: [28, 48, 35, 29, 46, 27, 60], label: 'Series B' },
        { data: [0, 20, 11, 19, 10, 22, 9], label: 'Series A' }
        ];
export const lineChartLabels: Array = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
        export const lineChartOptions: any = {
        animation: {
            duration: 1000, // general animation time
            easing: 'easeOutBack'
        },
        hover: {
            animationDuration: 1000, // duration of animations when hovering an item
        },
        responsiveAnimationDuration: 1000, // animation duration after a resize
        responsive: true,
        maintainAspectRatio: false,
        scales: {
            xAxes: [{
            display: true,
            ticks: {
                padding: 4
            },
            gridLines: {
                color: '#f3f3f3',
                drawTicks: false,
            },
            scaleLabel: {
                display: true,
                labelString: 'Month',
            }
            }],
            yAxes: [{
            display: true,
            gridLines: {
                color: '#f3f3f3',
                drawTicks: false,
            },
            ticks: {
                padding: 4
            },
            scaleLabel: {
                display: true,
                labelString: 'Value',
            }
            }]
        },
        };
        export const lineChartColors: Array = [
        {
                backgroundColor: 'rgb(138,233,204,0.5)',
                borderColor: 'rgb(138,233,204,1)',
                pointBackgroundColor: 'rgb(138,233,204,1)',
                pointBorderColor: '#fff',
                pointHoverBackgroundColor: '#fff',
                pointHoverBorderColor: 'rgb(138,233,204,0.2)'
            },
            {
                backgroundColor: 'rgb(68,186,239,0.8)',
                borderColor: 'rgb(168,186,239,1)',
                pointBackgroundColor: 'rgb(168,186,239,1)',
                pointBorderColor: '#fff',
                pointHoverBackgroundColor: '#fff',
                pointHoverBorderColor: 'rgb(168,186,239,1)'
            },
            {
                backgroundColor: 'rgb(1,57,204,2.5)',
                borderColor: 'rgb(166,157,204,1)',
                pointBackgroundColor: 'rgb(166,157,204,1)',
                pointBorderColor: '#fff',
                pointHoverBackgroundColor: '#fff',
                pointHoverBorderColor: 'rgb(166,157,204,1)'
            }
        
        ];
export var lineChartLegend = true;
export var lineChartType = 'line';