javascript - 如果元素具有 Id 或 Class( Angular )，则应用指令

Question

这是我在尝试学习 Angular 时遇到的一个普遍问题。

How would you create a directive that only acts on certain elements which have the directive name AND an ID, Class, or other property? Or/Also how might you make a directive that does different things depending upon ID, Class or other properties?

我指的不是将指令创建为类的那种类型，只需使用 ngClass。举个例子……想象一下这样一个场景，用户正在定义 HTML 的一部分，而我无法触摸它，但我知道其中会有一个带有 ul 和 li 的导航标签。我如何制定一个指令，该指令可以应用于具有 id="navi" 的导航标记，而不影响页面上的其他导航标记(如果有)？

---

需要说明的是，我有 jQuery 背景，所以我正在努力改掉很多坏习惯，哈哈。我非常习惯通过 $ 选择一个元素或一组元素并应用某种操作或您拥有的东西的概念。在我无法直接接触部分 HTML 的情况下，如何实现这种类型的选择性过滤功能？

Answer 1

您可以访问 element手头以及 link 中该元素的属性功能。关于你的例子<nav id="navi">案例:

<nav my-directive id="navi"></nav>

指令时间!

.directive("myDirective", [function() {
    return {
        restrict: "A",
        link: function(scope, elem, attrs) {
            if (elem[0].id == "navi") {
                //apply specific condition to elem here
            }
        }
    }
}]);

如您所见，您可以检查 element 的特定属性在链接功能中。 attrs也是具有所有元素属性的对象。