title: I can't open calander using primeNg calander module in angular, my code is below, Can't work in showOverlay method
body: <ul>
  <li>
  <ul>
  <li><p>HTML</p>
    
    
      
        
          Today
          Yesterday
          Last 7 days
          Last 30 days
          Custom
        
      
  <pre><code>&lt;div class=&quot;order-2 order-sm-1&quot; style=&quot;width: 15px&quot;&gt;
    &lt;p-calendar
      [formControl]=&quot;dateRange&quot;
      selectionMode=&quot;range&quot;
      (onSelect)=&quot;submitDateRange()&quot;
      #customDateRange
      [style]=&quot;{}&quot;
      [inputStyle]=&quot;{ visibility: 'hidden' }&quot;
    &gt;&lt;/p-calendar&gt;
  &lt;/div&gt;
  </code></pre>
    
    
  <p>My ts file</p>
  <p>submit(range: string) {
  switch (range) {
  case DateRangeSelectionText.TODAY:
  this.getTodayDate()
  break</p>
  <pre><code>    case DateRangeSelectionText.YESTERDAY:
        this.calculateDateRange(1)
        break
  
      case DateRangeSelectionText.LAST_7_DAYS:
        this.calculateDateRange(7)
        break
  
      case DateRangeSelectionText.LAST_30_DAYS:
        this.calculateDateRange(30)
        break
  
      case DateRangeSelectionText.CUSTOM:
        setTimeout(() =&gt; {
          this.calendar.showOverlay(this.calendar.inputfieldViewChild.nativeElement)
        }, 1)
    }
  }
  </code></pre>
  </li>
  </ul>
  </li>
  </ul>