指令与服务

Element Angular 内部携带了一些功能性的指令与服务，你可以直接使用它们。

[el-class]

[el-class] 可以在任何 Element Angular 组件上使用，它接受一个字符串参数，帮助你在组件上增加一个自定义的样式类。

[el-class] 属性是作用与 ng-template 上，如下文在 el-alert 上使用的指令，不会将 class 直接插入在组件中，而是组件的父元素 Angular 创建的 元素上，所以下文中使用了 > div 来选中子级元素。

下面的示例就是如何使用 [el-class] 来为组件添加自己需要的 class 类名：

<el-alert [el-class]="'myClass'">text</el-alert>
// in Component style:
<script type="text/scss">
.myClass {
  >div {
    color: #ccc;
  }
}
</script>

需要注意的是，在你自己的组件内别忘了使用 ViewEncapsulation.None 来覆盖样式，如果缺少样式指定的打包方式，组件内部是无法覆盖继承的样式。