如何在 Angular 中的运行时添加 Freshdesk 小部件？

Question

我正在使用 Angular 9 并尝试将 Freshdesk 小部件添加到我的应用程序。该小部件的代码段如下所示：

<script>
window.fwSettings={
'widget_id': <MY PERSONAL ID>,
'locale': 'en'
};
!function(){if("function"!=typeof window.FreshworksWidget){var n=function(){n.q.push(arguments)};n.q=[],window.FreshworksWidget=n}}()

如果我将代码片段直接添加到我的 index.html 文件中，它可以正常工作，但我希望能够以编程方式将 locale 属性设置为当前用户选择的任何语言.

这意味着需要在运行时添加此代码段，但我不知道如何在 Angular 中添加。

有什么想法吗？

Answer 1

我解决了。在我的 app.component.ts 中，我在加载我的应用程序语言环境后将代码片段放入一个函数中：

loadFreshDesk(locale): void {
   window.fwSettings = {
      widget_id: MY_WIDGET_ID,
      locale: MY_FRESH_DESK_LOCALE,
    };

    !(function () {
      if ('function' !== typeof window.FreshworksWidget) {
        const n = function () {
          n.q.push(arguments);
        };
        (n.q = []), (window.FreshworksWidget = n);
      }
    })();
    const script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = 'https://widget.freshworks.com/widgets/MY_WIDGET_ID.js';
    document.getElementsByTagName('head')[0].appendChild(script);
}

如何在 Angular 中的运行时添加 Freshdesk 小部件？

How can I add a Freshdesk widget during runtime in Angular?

freshdesk

angular