Question

我在Chartjs中使用Angular 5。我有一个图表，希望高度根据布尔变量（显示）而变化。如果为true，则我希望高度为25。如果为false，我希望高度为65。我尝试了此操作，但它不起作用。如何有条件地更改高度？

<div  [hidden]="!chart" style="position: relative; float: left; ">
            <canvas id="canvas" width="100" height="{show ? '25':'65'}">{{ chart }}</canvas>
</div>

Answer 1

这是错误的语法。

height="{show ? '25':'65'}"

我假设您将其与React混合在一起。在Angular中，首先需要将prop的名称包装在[]中，例如[height]，然后在右侧仅指定一个JavaScript表达式（不将其包装在{}中）

[height]="show ? '25px' : '65px'"

您还必须指定单位。

如果您不想指定单位，则可以使用另一种方法：

[height.px]="show ? 25 : 65"

动态更改chartjs的高度

1 个答案: