在ngIf内部时，Chart.js图表​​不会显示。

Question

我在使用Chart.js创建的引导面板中有一个简单的散点图表。它工作/显示完全正常，直到我把它放在一个ngIf div。有人遇到过这个吗？有关如何制作图表的任何想法吗？我的示例中ngIf的要点是，只有在填充变量panel-body后才显示chartData的内容（即图表）。

这是我的图表代码（我已经注释掉了ngIf div）：

<!--<div *ngIf="chartData.length">-->
    <div class="panel panel-primary" style="border-color: #464646;">
        <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
            <div style="float: left; margin-top: 5px;">Line Chart</div>
        </div>

        <div class="panel-body">
            <div>
                <canvas id="myChart" width="325" height="325"></canvas>
            </div>
        </div>
    </div>
<!--/div>-->

Answer 1

当您尝试初始化图表时，

#myChart在DOM中不存在。尝试使用ng-show代替ng-if。

无论如何，它就像你在填充数据时没有从控制器初始化图表一样，就像你应该做的那样。

希望它有所帮助。

Answer 2

您仅需在创建div后才创建Chart对象，所以请在更改chartData.length的同一位置调用创建Chart的函数，而不是在创建组件之后立即调用