刷新Angular路线上的Google广告（Adsense）

Question

我无法在布局组件上的路线更改上刷新Google Adsense 这是我的应用程序路线修饰

  //app-routing-module
  {
    path: '',
    component: LayoutComponent,
    children: [
      {
        path: '',
        loadChildren: () => import('./pages/pages.module').then(m => m.PagesModule)
      }
    ]
  },

是路由模块

const routes: Routes = [
  {
    path: '',
    component: HomeComponent,
  },

Google Ad代码在单独的横幅组件

  //banner component ts


  const navEndEvents = this.router.events.pipe(filter(event => event instanceof NavigationEnd))
    navEndEvents.subscribe((event: any) => {
      this.initGoogleAd();
    });
  private initGoogleAd() {
    try {
      (adsbygoogle = window.adsbygoogle || []).push({});

    } catch (e) { }
  }

HTML中

  <div>
    <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6053771666988490"
                data-ad-slot="9396915897" data-ad-format="auto" data-full-width-responsive="true"></ins>
  </div>

横幅

组件

//..some other elements
  <app-banner></app-banner> //google ads not refreshing without reload
//..

这里

..some other elements
  <app-banner></app-banner> //works on home component though
..

，

Answer 1

用rxjs acrapiorSubject

>在banner Service中创建 experioSubject

export class BannerService extends ApiService {
  bannerShow  = new BehaviorSubject<boolean>(true)
}

caping> caping

navEndEvents.subscribe((event: any) => {
  this.bannerService.bannerShow.next(false)
  this.bannerService.all(3).subscribe((res: any) => {
    this.bannerService.bannerShow.next(true)
  });
});

//创建的 bannershow可观察到async管道

//layout component ts
<app-banner *ngIf="bannerService.bannerShow | async"></app-banner>