title: How do I embed the Calandly widget into an Angular app?
body: <p>I am trying to embed the <a href="https://calendly.com/" rel="nofollow noreferrer">Calendly</a> widget into an Angular app and am not quite sure how to accomplish this.  Since I will be calling this widget with variable data, I would like to invoke the widget with a user activated function.  Based on the documentation and <a href="https://stackoverflow.com/questions/55973983/calendly-widget-not-working-in-ie-angular-app">this StackOverflow</a> I have added the following method in my component:</p>
  <pre><code>getEventCalender() {
      Calendly.initInlineWidget({
        url: myVariable.url,
        parentElement: document.querySelector('.calendly-inline-widget'),
       });
    }
  </code></pre>
  <p>and call it with the following (in my .html)</p>
  <pre><code>&lt;div&gt;
    &lt;button (click)='getEventCalender()'&gt;view cal&lt;/button&gt;
  &lt;/div&gt;
  
  &lt;div class=&quot;calendly-inline-widget&quot;&gt;&lt;/div&gt;
  </code></pre>
  <p>I can see that I need the <code>Calendly.initInlineWidget</code> method supplied by the .js api, however I'm not quite sure how to access it.  I have tried downloading the file and importing it into my component, however it didn't work (maybe I did this incorrectly).  I suspect this has something to do with the .js file not exporting the method, but not sure where to go from here.</p>
  <p>Can anyone provide some direction?</p>