Angularjs 使用与标准html标记匹配的指令是推荐的还是良好的做法？

我想在整个页面中编写一个只适用于

IMG

标记的指令，最初我认为我必须用一个自定义指令名来装饰每个标记，例如：

但是，当我为这个问题准备一些示例代码时，我决定看看指令是否与元素

IMG

本身匹配。成功了

以下是我所做的：

---

正如您所看到的，我希望页面上的所有图像在加载时淡入。我想在不使用jQuery的情况下以一种角度的方式来做这件事，所以我认为这是一种很好的方法，但这是一种很好的实践吗？在我的例子中，我真的希望这种逻辑适用于我页面上的所有图像（可能有数百个），因此我认为这是一种干净的方法，但就我的一生而言，我还没有发现任何其他地方有人这样做（即，将指令与

IMG

标记或任何标准标记相匹配）.

我想我应该避免img指令。请注意，Angular已经添加了自己的与html元素名称匹配的指令（例如，form、input、select、script），因此，如果它们（或您使用的任何库）使用相同的指令名称，则可能会发生冲突。你真的想在所有图像中淡入淡出吗？如果在页面上使用图像作为装饰会怎么样

---

似乎最好是添加属性。这是非常直观的名义努力。如果您不关心内置属性，您也可以创建自己的元素（例如）。

我也有同样的想法，希望避免使用img指令，但我处于一种独特的情况，即我们使用的是严格控制的。这是一个严格的内部应用程序，在Chrome浏览器上只能在一台机器上运行。我真的很想淡化所有图像。这个应用程序非常注重图像，显示数百张图像的可折叠列表，更改应用程序不同区域的背景图像，等等。我已经测试了我在plunker示例中获得的解决方案，它使应用程序看起来非常流畅流畅，所以我可能会坚持使用它，直到找到更好的解决方案。

app.directive('img', function () {
    return {
        restrict: 'E',
        link: function (scope, element) {
            element.bind('load', function () {
                element.addClass('fadeIn');
            });
            element.bind('error', function () {
                element.removeClass('fadeIn');
            });
        }
    };
});