如何在Material 2快餐栏中添加任何html元素

Question

我的要求是显示微调内材料2点心吧。

在我们的应用程序中，我们使用快餐栏来显示加载、成功和错误消息。在加载消息时，我也想显示微调器。我试图在快餐栏中添加loader div，但它呈现为文本，而不是HTML元素。

我试图添加与CSS类，但它是应用于整个快餐店元素。

我认为如果我们能够在快餐栏中插入另一个html元素，那么我们就可以显示加载器和消息。

您的帮助我们将不胜感激。

Answer 1

您希望使用哪种类型的旋转器？

我会看看Angular-Busy，我以前用过它，它很有前途。至于内部html，我不知道添加内部HTML元素有多容易。我认为它的主要目的是显示一点信息。也许您应该考虑使用引导程序警报，并将其隐藏起来，直到出现错误或警告消息。

不幸的是，材料的角度文档至少可以说是可怕的。

下面是一个示例，您可以将其用于Toast通知https://codepen.io/anon/pen/weyJVP中的微调器

<div id="demo-toast-example" class="mdl-js-snackbar mdl-snackbar"> <div class="mdl-spinner mdl-spinner--single-color mdl-js-spinner is-active"></div> <div class="mdl-snackbar__text"></div> <button class="mdl-snackbar__action" type="button"></button>

我打赌你可以在angular中的微调器上设置一个observable或boolean的is-active值。

祝你好运。