2つのデータをプレミックスUIコンポーネントに結合する

Question

グラフをプロットするためのプレックスUIコンポーネントを使用するページ2を開発しようとしています。現在、静的なjsonデータをグラフに表示しようとしています。しかし、データをバインドすることができないため、グラフはページに表示されません。コンソールでも、エラーではありません。 chartData jsonの値をpx-vis-timeseriesタグに直接渡すとグラフが表示されます。そのため、データをプレックスコンポーネントにバインドする際の問題です。私は、Angle 2とPreix UIの両方に新しいです。だから私はこれをいかに束縛するか分からない。誰かが私を助けてくれますか？ @jennyあなたは何か考えていますか？私は

export class AppComponent{ 
    var chartData = '[{"x":1397102460000,"y0":11.4403,"y1":96.5,"y2":0.56,"y3":0.56},{"x":1397139660000,"y0":13.1913,"y1":96.5,"y2":0.4,"y3":0.4},{"x":1397177400000,"y0":12.8485,"y1":96.5,"y2":0.43,"y3":0.43},{"x":1397228040000,"y0":10.975,"y1":96.5,"y2":0.33,"y3":0.33},{"x":1397248260000,"y0":12.9377,"y1":96.5,"y2":0.47,"y3":0.47},{"x":1397291280000,"y0":13.3795,"y1":96.5,"y2":0.41,"y3":0.41},{"x":1397522940000,"y0":16.4446,"y1":96.5,"y2":0.32,"y3":0.32},{"x":1397542800000,"y0":12.2771,"y1":96.5,"y2":0.35,"y3":0.35},{"x":1397640960000,"y0":13.0709,"y1":96.5,"y2":0.34,"y3":0.34},{"x":1397663100000,"y1":88.8,"y2":0.28,"y3":0.28},{"x":1397700000000,"y0":12.6198,"y1":95.2,"y2":0.49,"y3":0.49},{"x":1397753040000,"y0":11.0486,"y1":96.5,"y2":0.35,"y3":0.35},{"x":1397772540000,"y0":14.6892,"y1":96.5,"y2":0.21,"y3":0.21},{"x":1397794860000,"y0":14.3738,"y1":96.5,"y2":0.42,"y3":0.42},{"x":1397813580000,"y0":10.4259,"y1":76.5,"y2":0.58,"y3":0.58},{"x":1397890680000,"y0":13.4261,"y1":96.5,"y2":0.37,"y3":0.37},{"x":1397932020000,"y0":13.0062,"y1":96.5,"y2":0.27,"y3":0.27},{"x":1397973480000,"y0":14.475,"y1":96.5,"y2":0.35,"y3":0.35}]'; 
} 

）

app.component.tsが

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2 id="title_tag" >Timeseries - Chart</h2> 
     <px-vis-timeseries 
      prevent-resize 
      width = "1200" 
      height = "800" 
      include-all-series 
      render-to-canvas 
      selection-type= "xy" 
      chart-data='{{chartData}}' 
      series-config='{{seriesConfig}}' 
      x-axis-config='{"title":"Date"}' 
      y-axis-config='{"title":"Single","titleTruncation":false,"unit":"F","axis1":{"title":"Temperature","titleTruncation":false,"unit":"C"}}' 
      disable-navigator> 
     </px-vis-timeseries> 
    </div> 
    ` 

を}ファイル... uはまた、同様のポストを持っていたし、uは答えを持っている場合は、事前にこの おかげで私を助けてくださいました

Answer 1

これは、角度2のバインディングとともにng-reflect属性があるためです。これはバインドに成功しないため、次のようにデータをバインドしてデータをバインドします。

[attr.chart-data] = 'chartData'