AngularJS等待标签加载到DOM中

AngularJS wait for tag to load into DOM

本文关键字：DOM 加载 等待 标签 AngularJS      更新时间：2023-09-26

我通过angular指令添加一个谷歌图表到一个页面，我想添加一个属性到它加载后创建的元素。在尝试添加属性之前，确保元素存在的最佳方法是什么?

从周围看，似乎我的指令，我应该工作，但没有:

.directive('vdfWidgetGoogleChart', ['$timeout', function ($timeout) {
return {
 restrict: 'E',
  //replace: true,
  templateUrl: 'widgetgooglechart.html',
  link: function ($scope, elem, attrs) {
      function addTabIndex () {
        elem.find('svg').attr({tabindex: -1});
      }
      $timeout(addTabIndex);
  },
  scope: {
    chartObject: '='
  }
}

就我个人而言，在绘制图表时最简单的事情是将属性附加到SVG元素，然后您将非常有棱角，因为您不是在寻找元素。

另一个选择是创建一个控制器，然后为需要该控制器的元素SVG创建一个指令。然后当你有SVG作为该指令的子指令时你的SVG指令应该被调用。(这是一个猜测，我没有尝试过)

<div controller-directive=".."><svg></svg></div>

那么当控制器作为父控制器存在时，您的代码将具有SVG。

或者你可以简单地调整你的代码，每100毫秒左右寻找svg，直到你找到它。

function addTabIndex () {
    var svg = elem.find('svg');
    if (svg.length != 0)
        svg.attr({tabindex: -1});
    else
        $timeout(addTabIndex, 100);
}
$timeout(addTabIndex);
相关文章：