In my Angular4 - Node.js application I am getting the following error at run time.
Can't bind to 'data' since it isn't a known property of 'canvas'. ("iv>
][data]="doughnutChartData" [labels]="doughnutChartLabels" [chartType]="doughnutChartType" (chartHover"): ng:///AppModule/DashboardComponent.html
The component's module.ts file looks like this :
import { NgModule } from ''; import { CommonModule } from ''; import { ChartsModule as Ng2Charts } from 'ng2-charts'; import { DashboardRoutingModule } from './dashboard-routing.module'; import { DashboardComponent } from './dashboard.component'; import { TimelineComponent, NotificationComponent, ChatComponent } from './components'; import { StatModule } from '../shared'; @NgModule({ imports: [ CommonModule, Ng2Charts, DashboardRoutingModule, StatModule, ], declarations: [ DashboardComponent, TimelineComponent, NotificationComponent, ChatComponent ] }) export class DashboardModule { } The componenet.html file looks like this :
<div class="col col-sm-6"> <div class="card mb-3" style="border: none"> <div class="card-header claim-header-style" style="background: #FC0!important;color: #fff;"> SUSPECT REASON </div> <div class="card-block"> <canvas baseChart height="180px" [data]="doughnutChartData" [labels]="doughnutChartLabels" [chartType]="doughnutChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"> </canvas> </div> </div> </div> <div class="col col-sm-6"> <div class="card mb-3" style="border:none;"> <div class="card-header claim-header-style" style="background: #28426b!important;color: #fff;"> REJECT REASON </div> <div class="card-block"> <canvas baseChart height="180px" [data]="doughnutChartData" [labels]="doughnutChartLabels" [chartType]="doughnutChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"> </canvas> </div> </div> </div> What could be wrong here ?
