Angular中如何复用_blank窗口打开不同链接？

这个需求完全可以实现，核心是给目标窗口指定一个固定的名称，替代原来的_blank参数。

修改步骤 #

1. 在doSetup方法中，将window.open的第二个参数从"_blank"改为自定义的固定名称（比如"sharedExternalWindow"）。
2. 保留原有的窗口大小、位置设置逻辑即可。

修改后的doSetup代码示例：

doSetup(url: string) {
  const altScreen = window.screen; // 假设altScreen为当前屏幕对象
  // 使用固定窗口名称替代_blank
  const newChildWindow = window.open(
    url, 
    "sharedExternalWindow", 
    `width="${altScreen.availWidth}", height="${altScreen.availHeight}"`
  );

  newChildWindow?.resizeTo(altScreen.availWidth, altScreen.availHeight);
  newChildWindow?.moveTo(altScreen.left, 0);
}

关键说明 #

• 当使用固定窗口名称时，浏览器会优先查找是否存在同名的已打开窗口：
  • 若窗口已存在，会直接在该窗口内加载新URL，不会创建新窗口；
  • 若窗口已被用户手动关闭，下次点击按钮时会重新创建该名称的窗口。
• 原有的窗口尺寸、位置设置逻辑可保留，确保每次加载链接时窗口保持预期显示状态。
• 注意：部分浏览器的弹窗拦截机制可能影响首次窗口打开，当前按钮点击的用户主动触发场景符合浏览器安全要求，无需额外处理。

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