angular - 可以初始化booking.com表格1次，但不能使用ngOnInit再次初始化

因此，我在angular4中使用了 Angular 形 Material ，并将html.booking.com表单的HTML放在了MdDialogue组件中。当有人按下按钮时，我希望此对话框以其内部的形式弹出。应用加载后，它可以按预期的方式运行1次，但不会再次运行。我希望它每次都能工作。没有错误消息，所以我不清楚为什么会这样。 booking()中的逻辑将初始化表单。

booking.com表单的html如下所示。

<ins class="bookingaff" data-aid="1179852" data-target_aid="1179846" data-prod="nsb" data-width="100%" data-height="auto">
  <!-- Anything inside will go away once widget is loaded. -->
  <a href="//www.booking.com?aid=1179846">Booking.com</a>
</ins>

这是booking.com组件的外观...

...
     openBookings(){
        let dialogRef = this.dialog.open(Booking_com);
        dialogRef.afterClosed().subscribe(result => {
        });
      }

      debug(data){
        console.log(data);
      }



    }

    @Component({
      selector: 'Booking_com',
      templateUrl: 'Booking_com.html',
      styleUrls: ['Booking_com.sass']
    })
    export class Booking_com implements AfterViewInit{


      ngAfterViewInit(): void {
        this.booking();
      }

      constructor(public dialogRef: MdDialogRef<Booking_com>) {}


      booking(){
        (function(d, sc, u) {
          var s:any =  d.createElement(sc);
          var p:any =  d.getElementsByTagName(sc)[0];
          s.type = 'text/javascript';
          s.async = true;
          s.src = u + '?v=' + (+new Date());
          p.parentNode.insertBefore(s,p);
        })(document, 'script', '//aff.bstatic.com/static/affiliate_base/js/flexiproduct.js');
      }
    }

图像显示它是第一次运行，但是第二次却没有。...关于为什么会发生这种情况以及如何解决此问题的任何想法都很棒。

最佳答案

检查affiliate script可以看到，加载此脚本后，它将调用一次BookingAff.run()函数，如下所示:

function u() {
  if (_i_("5fc:14"), u.already_ran) return _r_();
  u.already_ran = !0;

如果已经设置了already_ran标志，则退出。因此，我们将需要在每个模式打开时将其取消设置:

// reset already_ran flag
if (window.BookingAff && window.BookingAff.run.already_ran) {
  window.BookingAff.run.already_ran = false;
}

由于这两个原因，预订表格在第一个模式开放时仅呈现一次。

还有一个原点检查，仅允许booking.com或bstatic.com的原点:

var r, i = new RegExp("(booking|bstatic).com$");
if (!e.origin.match(i)) return _r_();

因此，我们不能只在域中打开的每个模式上运行BookingAff.run()。

最简单的解决方案是在每个模式打开时调用booking()函数(当然，在重置already_ran标志之后)。

塞子:https://plnkr.co/edit/IlAa7XJDjQIxd6IgKXIe?p=preview

我的小伙子说我有一个JS错误



它来自googlet的原始示例https://material.angular.io/components/component/dialog及其链接链接