指令md-whiteframe和css类md-whiteframe之间的区别

Question

我正在尝试使用Angular Material框架，并真正享受每一个功能！我真的很喜欢md-whiteframe指令来提高某些容器。不过，我注意到有不同的使用方法。

的Angular Material Documentation使用它作为一个指令：

<div md-whiteframe="2"> 
    <span>I'm elevated!</span> 
</div> 

虽然有很多的例子使用它作为一类CSS：

<div class="md-whiteframe-z2"> 
    <span>I'm elevated!</span> 
</div> 

的文档还指定了MD-whiteframe可以提高起来到24dp，而“班级版”只能达到4个不同的级别。

这两种方法有什么区别？什么时候应该使用指令或CSS类？

我认为差异来自于'类版本'的Material Design Lite CSS库，而指令版本仅适用于角度材质。但我没有找到可以证实这一点的来源...

Answer 1

其实很简单。属性指令md-whiteframe将.md-whiteframe-z<x>类添加到元素。所以，我猜你可以同时使用两者。哪一个取决于，如果你喜欢做或不使用JavaScript来添加一个类到一个元素。

使用JS和指令的亲也是验证的dp值。当然，这是一个很好的抽象，因为也许类名称会改变，但是您的指令API不会。