angular iframe src发生改变页面不刷新

Question

已经尝试的方法

1. 添加参数
   http://localhost:4200/user/userDetails?userId=xx&time=xxxx
2. 发生变化之后，先将iframeUrl = null，之后为iframeUrl重新复制
   问题都没有解决

@ViewChild("targetIframe", {static: true}) targetIframe?: HTMLIFrameElement；

  change(userId: string) {
    this.iframeSrc1 = null;
    const time = new Date().getTime();
    this.iframeSrc1 = `http://localhost:4200/user/userDetails?userId=${userId}&time=${time}`
    this.targetIframe?.contentWindow?.location.reload();
  }

contentWindow获取不到该怎么处理？

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

你可以尝试使用ngOnChanges生命周期钩子来检测userId的变化，并在变化时更新iframe的src。这是一个示例：

import { Component, OnChanges, SimpleChanges, ViewChild } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
    <iframe #targetIframe [src]="iframeSrc1"></iframe>
  `,
})
export class AppComponent implements OnChanges {
  @ViewChild('targetIframe') targetIframe: HTMLIFrameElement;
  iframeSrc1 = '';

  ngOnChanges(changes: SimpleChanges) {
    if (changes.userId && changes.userId.currentValue !== changes.userId.previousValue) {
      this.updateIframeSrc();
    }
  }

  updateIframeSrc() {
    const time = new Date().getTime();
    this.iframeSrc1 = `http://localhost:4200/user/userDetails?userId=${this.userId}&time=${time}`;
    this.targetIframe.contentWindow.location.reload();
  }
}

在这个示例中，我们使用了ngOnChanges钩子来检测userId的变化。当userId发生变化时，我们调用updateIframeSrc方法来更新iframe的src并刷新页面。