如果用戶單擊圖標圖像，如何顯示bsDatePicker彈出窗口

Question

我正在使用datepicker，它工作正常，但是即使用戶單擊輸入字段中的圖像，我也想使彈出窗口可見

        <div class="col-6">
            <div class="fake-input ml-auto">
                <img src="{{environment.assets_base_url}}assets/images/calendar.png" (click)="clickOnDateField(data.slug)" class="inlineBlock hand-cursor">
                <input type="text" [(bsValue)]="dateValue" value="{{dateValue | date: 'dd/MM/yyyy'}}" bsDatepicker
                       name="{{data.slug}}" id="{{data.slug}}" placeholder=" Date" class="inlineBlock question-row-face"
                       style="padding-left: 12px;padding-right: 12px">
            </div>
        </div>

我試圖觸發對bsdatefield的單擊，但仍然無法正常工作。 這是點擊圖片時要調用的代碼

clickOnDateField(slug) {
    $( document ).ready(function() {
      $('#' + slug).click();
    });
  }

Answer 1

@Rob為我指明了正確的方向

我沒有使用單獨的圖像，而是使用圖像圖標作為輸入字段的背景，如下所示：

[ngStyle]= "{'background': 'url('+ (calanderImageLink) +') right no-repeat'}"

用戶感覺好像有一個圖標，但是該圖標實際上是輸入字段的背景，並且當用戶甚至在圖標上單擊時，DatePicker也會顯示