将组件应用于Angular2中的模板

我有一个简单的组件，使用如下模板：

<span style="display:inline-block;" #control>Content here</span>

这里的内容

然后，在呼叫站点中，我会摆弄样式：

<my-comp style="width:300px;"></my-comp>

…这绝对是一事无成的。在运行时，上述内容转化为：

<my-comp style="width:300px;" class="ng-untouched ng-pristine ng-valid">
  <span style="display:inline-block;" #control>Content here</span>
</my-comp>

满足于此

太棒了。在

上，宽度被忽略，而在

上我想要它的地方，它没有被应用

---

我知道我可以将宽度作为组件的一个属性，然后将其应用到模板中，但我的问题比这更广泛：如果我不想对所应用的样式进行规定，该怎么办？有没有办法让调用站点的属性自动应用于模板的外部元素？

自定义组件在浏览器中呈现为内联的，这意味着您不能向其添加宽度，除非您更改其位置（

绝对的

/

固定的

）或更改显示（

block

/

inline block

/

flex

/

inline flex

）

因此，要么更改内联样式（不赞成），要么向组件添加css规则：

@Component({
   selector : 'my-comp',
   template : `...`,
   styles : [`:host{display: inline-block}`]
})
export class MyCompComponent {}

---

自定义组件在浏览器中呈现为

内联

，这意味着您无法向其添加宽度，除非您更改其位置（

绝对

/

固定

）或更改显示（

块

/

内联块

/

柔体

/

内联柔体

）

因此，要么更改内联样式（不赞成），要么向组件添加css规则：

@Component({
   selector : 'my-comp',
   template : `...`,
   styles : [`:host{display: inline-block}`]
})
export class MyCompComponent {}

---

你能用简单的话解释一下你到底想要什么吗？你能不能试试

。如果它不起作用，请提供一个Plunker。我认为这与Angular2无关，而是一个简单的CSS问题。@micronyks这些是我简单的话：）你发现什么不清楚？单词不复杂，难以理解。对我来说，我不明白你到底想要什么。这就是我想知道的，换句话说……你能用简单的话解释一下你到底想要什么吗？你能试试

。如果不起作用，请提供一个Plunker。我不认为这与Angular2有关，但这是一个简单的CSS问题。@micronyks这是我简单的话：）你发现了什么不清楚？单词并不复杂，难以理解。对我来说，我不明白你到底想要什么。这就是我想知道的也许换句话说。。。