小编win*_*ej0的帖子

我将 Calendly 小部件嵌入到一个简单的 Angular 应用程序中。它适用于 Chrome、Firefox 和 Edge，但在 IE 中只显示一个空白的白框。

该网站的工作网址是https://cei-demo.firebaseapp.com/schedule-an-appointment

我曾尝试使用 innerHTML 从组件而不是在模板中呈现 HTML 代码。我有同样的问题。

calendly.component.html

<div class="my-5 p-3 container bg-white text-dark">
  <div class="calendly-inline-widget" data-url="https://calendly.com/test-cei" style="min-width:320px;height:700px;"></div>
</div>

index.html（body 标签正上方）

<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>

我希望小部件显示在所有浏览器中。

下面是响应 Dmitry Pashkevich 的代码：

组件.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-calendly',
  templateUrl: './calendly.component.html',
  styleUrls: ['./calendly.component.css']
})
export class CalendlyComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }
}

组件.html

<div class="my-5 p-3 container bg-white text-dark">
  <div class="calendly-inline-widget" style="min-width:320px;height:580px;" data-auto-load="false">
</div> …