title: ngx-joyride not showing when click on button
body: <p>I have implemented <strong>ngx-joyride</strong> for the demo purpose of my website. </p>
  
  <p>But it is not showing anything when clicking on the button (joyride is button). </p>
  
  <p>I am attaching the screenshot of my angular 9 browser console and webpage so that you can get better idea.</p>
  
  <p>Please help me to resolve the issue. Thanks in advance.<a href="https://i.stack.imgur.com/qQhS8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qQhS8.png" alt="Error and browser dom"></a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//Angular 9 code 
  import {
    Component,
    OnInit,
    ElementRef,
    ViewChild,
    AfterViewInit,
  } from "@angular/core";
  import { JoyrideService } from "ngx-joyride";
  
  @Component({
    selector: "app-temporary",
    templateUrl: "./temporary.component.html",
    styleUrls: ["./temporary.component.scss"],
  })
  export class TemporaryComponent implements OnInit, AfterViewInit {
    constructor(private joyride: JoyrideService) {}
  
    @ViewChild("ele1", { static: false }) ele1: ElementRef;
    @ViewChild("ele2", { static: false }) ele2: ElementRef;
  
    ngOnInit(): void {}
    ngAfterViewInit() {
      console.log("1", this.ele1);
      console.log("2", this.ele2);
    }
  
    //ngx-joyride-tour
    onClick() {
      // alert("coming here 1");
  
      console.log("joyrideService", this.joyride);
      this.joyride
        .startTour({ steps: ["ONE", "TWO"], logsEnabled: true })
        .subscribe(
          (step) =&gt; {
            console.log("coming step section");
            console.log(step);
          },
          (error) =&gt; {
            console.log("coming in error section");
          },
          () =&gt; {
            console.log("tour finished");
          }
        );
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;
      &lt;button class="btn btn-sm btn-primary" (click)="onClick()"&gt;joyride&lt;/button&gt;
      &lt;div joyrideStep="ONE" title="Page Title" text="Main title!" #ele1&gt;Text&lt;/div&gt;
      &lt;div joyrideStep="TWO" title="Page Title" text="Main title!" #ele2&gt;Div content&lt;/div&gt;
  &lt;/div&gt;
  &lt;h1&gt;Temporary PAge&lt;/h1&gt;</code></pre>
  </div>
  </div>
  </p>