javascript - 检查 Angular 是否已加载并用最新版本覆盖它

Question

我正在 SharePoint 2013 中开发一项非常复杂的功能，我需要在页面中包含 Angular 代码作为 Web 部件。

有几种情况，例如，

1. 母版页(页眉和页脚以及其余内容的共享布局)可能已经包含 angularJS 文件(也可以是旧版本)。

2. 当我们添加带有 Angular 代码的 Web 部件时，我还会在其中包含 Angular 脚本引用，因为我们永远不知道母版页/共享布局是否具有 Angular 引用。

我试图重现类似的情况 -

-包含两次 Angular 脚本。第一个是较旧的 Angular，第二个是最新的。代码无法运行并出现以下错误 -

WARNING: Tried to load angular more than once.
Uncaught TypeError: undefined is not a functionangular.js:26130 (anonymous function)

我想要实现的目标 -

我想检查母版页是否已经引用了 Angular，即使有，忽略它并更喜欢我给出的引用，因为我的代码将是模块化的并且依赖于我想要包含的脚本(最新的，最可能)

我知道这听起来很愚蠢，但这就是它与 SharePoint Web 部件一起工作的方式。我确信 Angular 中会有类似 noConflict 的方式。

Answer 1

要了解 angularjs 是否已加载到页面上，请在任何标记上查找 ng-app 属性。

您可以使用此功能:

function getAllElementsWithAttribute(attribute)
{
  var matchingElements = [];
  var allElements = document.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++)
  {
    if (allElements[i].getAttribute(attribute) !== null)
    {
      // Element exists with attribute. Add to array.
      matchingElements.push(allElements[i]);
    }
  }
  return matchingElements;
}

那么，

getAllElementsWithAttribute('ng-app');

引用这个问题

Can I get elements by attribute selector when querySelectorAll is not available without using libraries?

它可以帮助您检测 Angular 存在。即使我也有类似的情况，想知道如何找到 Angular 版本并加载最近的版本。