Angular：如何将内联样式传递给组件

Question

我创建了一个自定义组件。组件的HTML支架包含非常简单的HTML。

<!-- Generated template for the MyComponent component -->
<div>
  {{text}}
</div>

但是添加这样的样式是行不通的。

<my-component style="height:300px; background:gray;"></my-component>

我认为我需要将这种风格传递给人们<div>。但是如何？

Answer 1

try (as already mentioned by @1.618)

<my-component [ngStyle]="{height:'300px', background:'gray', display: 'block'}">
</my-component>

applying only style (with display: block or inline-block) will also work:

<hello style="color: green; height:200px; background:yellow; display: block;}" 
       name="Another name"></hello>