Angular 属性指令与组件样式？

角度2：何时使用属性指令，何时使用组件样式

有两种主要方法可以在中描述的Angular 2中设置元素的样式

• 属性指令
• 组件样式

组件样式可以通过以下方式实现：（模板内联样式、元数据中的样式URL、模板链接标记、CSS@imports）

我感兴趣的是在什么时候使用什么方法将样式应用于元素

因为它们都在官方文档中提到过，所以在某些情况下（甚至在某些情况下是模板内联样式），它们中的每一个都可能是最好的使用方法

docs demo属性指令正在响应用户事件。他们演示没有事件的组件样式

---

这是否意味着在大多数情况下，在响应事件应用样式时使用属性指令是一种很好的做法，而在没有事件的情况下应用样式时使用组件样式是一种很好的做法？

OfficialStyle Guide（）建议在包含超过3行（）

我刚刚发现的另一个提示：

当您有不带属性的表示逻辑时，请使用属性指令 模板

我能想到的没有模板的表示逻辑的唯一原因是使它在多个组件中可用

我们可以使用

：hover

轻松定义一个全局css样式，并在一对多模板中使用它。也是

没有模板的表示逻辑

不同的用法是：

Bombasta

vs

Bombasta

我真的看不出一个比另一个有什么好处，但是Angular 2官方文档总是用事件演示属性指令，对于任何不涉及事件的样式，它们都使用css

在样式06-01的本例中，它再次出现在事件（mouseover）中

因此，我认为他们认为在涉及事件时最好使用属性指令

我只是在学习Angular 2，所以我不确定每种造型方法的优缺点，但我可以想到以下几种可能的方法：

属性指令比css可能带来的好处

• 选择器可能比全局css选择器更简单（如果操作不正确，全局css选择器可能会变得杂乱无章，无法选择所需的元素）
• （我认为）您将属性指令导入到组件中，这表明了使用它的意图（可读性）
• 属性指令不是全局的，您必须导入它才能使用它

css上属性指令的可能缺点

• 然而，属性指令的代码要多一点，可能是一个单独的文件，这是最佳实践，所以它可能会更“繁重”