Angular 5 iframe隐藏页眉和页脚-Java 学习之路

我在我的应用程序中使用iframe . 外部网址有一个页眉/页脚，我想隐藏 . 下面是我到目前为止，我已经尝试了许多不同的变化，但没有任何运气使用element.remove和类“页脚” .

HTML

`  <iframe #iframe id="tcsFrame" [src]="<external_url_here>" 
    scrolling="no"
    frameBorder="0" 
    width="100%" 
    height="32000px" 
    type='text/html'"></iframe>
`

角度分量

`
import { Component, OnInit, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
import { DomSanitizer, BrowserModule } from '@angular/platform-browser';

@Component({
  selector: 'my-page-conditions',
  templateUrl: './my-page.component.html',
  styleUrls: ['./my-page.component.css']
})
export class TermsConditionsComponent implements OnInit, AfterViewInit {

  @ViewChild('iframe') iframe: ElementRef;

  constructor(private domSanitizer: DomSanitizer) {
  }

  ngOnInit() {
  }

  ngAfterViewInit() {
    let doc =  this.iframe.nativeElement.contentDocument || this.iframe.nativeElement.contentWindow;

doc.document.getElementsByClassName('page-footer').style.visibility = 'none';
doc.document.getElementsByClassName('page-footer').style.diplays = 'none';


  }

}

`

任何提示将不胜感激！

1 回答

所以，我给你的答案，但你最好还是认为这是更好的方法 . 我假设您在iframe中维护页面，最好将一些参数传递给url，而不是首先显示 Headers .

ngOnInit() {
    const self = this;
    this.iframe.nativeElement.onload = function () {
      const els = self.iframe.nativeElement.contentDocument.getElementsByClassName('header');
      if (els.length > 0) {
        els[0].style.display = 'none';
      }
    };
  }

回复于 2024-05-03T15:45:43+08:00

Angular 5 iframe隐藏页眉和页脚

1 回答

相关问题