angular - 无法绑定(bind)到 'chartData'，因为它不是 'div' 的已知属性，在 Angular 2 中？

Question

我正在创建一个 Angular 项目，但在开发这个项目时出现以下错误。我试图解决这个问题，但我没有。

异常:未捕获( promise ):错误:模板解析错误: 无法绑定(bind)到“chartData”，因为它不是“div”的已知属性。

EXCEPTION: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'chartData' since it isn't a known property of 'div'. ("<h1>Profile- {{name}} here</h1>
<div id="pie_chart",
    [ERROR ->][chartData]="pie_ChartData", 
    [chartOptions] = "pie_ChartOptions",
    chartType="PieChart",
"): ProfileComponent2@2:4

请指出我哪里做错了。

profile.component.ts:

import { Component, OnInit,HostBinding,Input }         from '@angular/core';
import { Router,ActivatedRoute }                 from '@angular/router';
import { slideInDownAnimation }                  from '../../animations/animations'
import { GoogleChart}                             from'../../../../directives/angular2-google-chart.directive';

@Component({
    selector: 'profile-component2',
    directives: [GoogleChart],
    templateUrl:`../app/modules/dashboard/dashComponents/profileComponents/profile.component.html`,
    animations:[slideInDownAnimation]
})

export class ProfileComponent2 implements OnInit {

name="Shubham";
message: string;
@HostBinding('@routeAnimation') routeAnimation = true;
@HostBinding('style.display')   display = 'block';
@HostBinding('style.position')  position = 'absolute';
public login:{} = {};
private interval:any;
ngOnInit() {
      console.log("profile component2 initialized");
  }
       public pie_ChartData = [
                 ['Task', 'Hours per Day'],
                 ['Work',     11],
                 ['Eat',      2],
                 ['Commute',  2],
                 ['Watch TV', 2],
                 ['Sleep',    7] ];

       public pie_ChartOptions  = {
         title: 'My Daily Activities',
         width: 900,
         height: 500
       };  
}

profile.component.html:

<h1>Profile- {{name}} here</h1>
<div id="pie_chart",
    [chartData]="pie_ChartData", 
    [chartOptions] = "pie_ChartOptions",
    chartType="PieChart",
    GoogleChart>    </div> 

Answer 1

是的，得到答案。

在 app.module.ts 中添加以下行:

import {GoogleChart} from '../directives/angular2-google-chart.directive';

@NgModule({
  imports: [ ],
  declarations: [GoogleChart]
})