无源码且调试信息禁用时，如何更新AngularJS构建的Primo链接URL？

针对Primo系统中无法通过angular.element().scope()获取Scope的问题，提供两种可行方案：

方案一：遍历RootScope查找目标Scope（私有API方式） #

当调试信息禁用时，可从$rootScope递归遍历所有子Scope，匹配目标元素对应的Scope：

1. 获取目标链接元素

const targetLink = document.querySelector('a[ng-href*="replaceMe"]');

2. 编写递归遍历Scope的函数

function getTargetScope(element) {
  const rootScope = angular.element(document.body).injector().get('$rootScope');
  
  function traverse(scope) {
    // 匹配包含service属性且DOM元素对应的Scope
    if (scope.service && angular.element(scope.$element).is(element)) {
      return scope;
    }
    // 遍历子Scope
    if (scope.$$childHead) {
      const found = traverse(scope.$$childHead);
      if (found) return found;
    }
    // 遍历兄弟Scope
    if (scope.$$nextSibling) {
      const found = traverse(scope.$$nextSibling);
      if (found) return found;
    }
    return null;
  }
  
  return traverse(rootScope);
}

3. 更新链接URL

const scope = getTargetScope(targetLink);
if (scope) {
  const docID = scope.pnx.control.recordid[0];
  scope.$apply(() => {
    scope.service["link-to-service"] = scope.service["link-to-service"].replace('replaceMe', docID);
  });
}

方案二：挂载自定义指令（官方扩展方式） #

利用Primo允许挂载AngularJS模块的特性，通过自定义指令在link阶段直接获取Scope：

1. 定义自定义指令模块

angular.module('primoCustomLinks', []).directive('updateThirdPartyLink', ['$timeout', ($timeout) => {
  return {
    restrict: 'A',
    link: (scope, element) => {
      // 延迟执行确保Scope数据已加载
      $timeout(() => {
        const url = scope.service["link-to-service"];
        if (url.includes('replaceMe')) {
          const docID = scope.pnx.control.recordid[0];
          scope.$apply(() => {
            scope.service["link-to-service"] = url.replace('replaceMe', docID);
          });
        }
      });
    }
  };
}]);

2. 动态给目标链接添加指令并编译

document.addEventListener('DOMContentLoaded', () => {
  const links = document.querySelectorAll('a[ng-href*="replaceMe"]');
  links.forEach(link => {
    link.setAttribute('update-third-party-link', '');
    // 重新编译元素激活指令
    const injector = angular.element(link).injector();
    injector.invoke(['$compile', ($compile) => {
      $compile(link)(angular.element(link).scope());
    }]);
  });
});

注意事项 #

• 方案一中的$$childHead、$$nextSibling属于AngularJS私有API，版本更新可能导致失效，优先使用方案二。
• 确保在Primo的馆藏项数据加载完成后执行代码，$timeout可避免数据未初始化的问题。
• 验证pnx.control.recordid[0]的路径是否与实际数据结构匹配，必要时调整属性路径。

内容的提问来源于stack exchange，提问作者Will Martin