css - 单击按钮时在按钮内显示加载栏

Question

我在 angularjs 中需要做一些简单的事情，需要一些 dom 操作，我认为它应该是某种指令，但我不知道如何处理它。

我有这个简单的按钮:(html)

      <button class="btn btn-success" style='margin-bottom:17px' style='margin-right:5px;' ng-show='pageToShow <  pages.length-1' ng-click='changePage("next")'>
         <span class="glyphicon glyphicon-arrow-right" style='margin-right:5px' aria-hidden="true"></span>Next 
      </button>

当我点击它时，我想要它的内部，而不是!字形的动人 gif，像这样:

1) 如何删除按钮内已经存在的 img 并替换它？ 2) 我想要其他类型的微调器，而不是圆形的微调器，如何更改默认微调器？

我该怎么做？

Answer 1

检查这个指令，它完全符合你的要求:

(离线)

还有一个演示:

(离线)

您可以将 button-prepend=""和 spinner-icon=""的类更改为定义您自己的微调器/gif 的 css 类。