javascript - Angular-ui 示例中的 Angular 链接函数 iElement Magic

Question

Angular 在链接函数中提供当前作用域的实例元素。

iElement Angular channel 能够执行标准 HTML 元素之外的操作。 Angular 是如何做到这一点的？先用 jQuery 包装一下？

这个 angular-ui tinymce implementation 中的链接元素如何获取tinymce方法，例如下面第 49 行显示的方法:

elm.tinymce();

我知道 ui-tinymce 属性链接到名为 uiTinymce 的指令，并且 tinymce 包含在主 html 中，但我不明白 elm 如何获取tinymce 方法。

作为引用，我提供了 http://docs.angularjs.org/guide/directive 中有关 iElement 的相关文档。下面。

Linking function:

function link(scope, iElement, iAttrs, controller) { ... }

The link function is responsible for registering DOM listeners as well as updating the DOM. > It is executed after the template has been cloned. This is where most of the directive logic > will be put.

scope - Scope - The scope to be used by the directive for registering watches.

iElement - instance element - The element where the directive is to be used. It is safe to manipulate the children of the element only in postLink function since the children have already been linked.

Answer 1

来自angular.element页面:

Note: All element references in Angular are always wrapped with jQuery or jqLite; they are never raw DOM references.

所以，是的，iElement 参数是一个 jQueryLite 或完整的 jQuery 对象，它具有 jQuery/jQueryLite 提供的所有相关附加方法。

这包括通过 jQuery 插件机制添加的任何其他方法，这些方法的作用是能够直接在 jQuery 对象本身上调用这些方法。

因此，TinyMCE JS 文件将包含将 .tinymce() 函数添加到所有 jQuery 对象的代码，这就是 iElement 对象的方式。

这有意义吗？