AngularJS 相当于 v-el答案

【问题标题】：AngularJS equivalent of v-elAngularJS 相当于 v-el
【发布时间】：2015-12-09 10:37:49
【问题描述】：

我刚刚在 Vue.js 中发现了 v-el 指令，它对 DOM 操作非常方便。

F.ex.我可以用它标记一个元素：

<button v-el="getCustomerButton">Get customers</button>

并且在 vue 组件中使用例如 this.$$.getCustomerButton.focus() 来聚焦按钮。

angularjs中有没有和v-el等价的东西？

问候，尼尔斯。

【问题讨论】：

标签： angularjs vue.js

【解决方案1】：

您可以使用以下指令实现相同的结果：

angular.module('yourModuleNameHere').directive('vEl', [function() {
  return {
    restrict: 'A',
    link: function(scope, element) {
        // do whatever you want with element
        // just element is the jqLite-wrapped object
        // element[0] is the raw DOM node
    }
  };
}]);

还要注意element被包装成一个jqLite对象，如果你想要原始的DOM节点，你可以用element[0]得到它。

通常，当您将指令应用于元素时，您可以在link 函数中访问该元素。

【讨论】：

没错，但这需要为每个标记的元素添加一个新指令。因此，两个不同的动作需要两个不同的指令，我觉得这很不灵活。 V-el 可以重复用于许多不同的操作。
或者，您可以将$event 变量传递给ngClick、ngBlur 等，并通过$event.target 获取元素。