javascript - Angularjs - 获取指令内的主体元素

Question

如何获取 Angular Directive(指令)中的body元素？我的目标是执行 jquery $('body').innerWidth(); inside 指令所做的事情。我不想使用 jquery，而是使用 Angular 内置 jqlite 实现。

Answer 1

如果您需要从应用于另一个元素的指令内访问 body 元素，您可以使用 $document服务就这样..

app.directive("myDirective", function($document) {
  return function(scope, element, attr) {
    var bodyWidth = $document[0].body.clientWidth;
    console.log("width of body is "+ bodyWidth);
  };
});

<button my-directive>Sample Button</button>

您还可以使用 jqLit​​e 中提供的 DOM 遍历方法(尽管它们的功能远不如 jQuery 提供的强大)。例如，您可以使用 angular.element.parent() 方法进行递归查找来查找 body 标记。