如何使用jQuery对象的事件触发器停止Angular（单击）事件的传播？

Question

我正在尝试在引导输入日期选择器的日期输入框中添加一个图标。我希望该图标充当打开和关闭日期选择器的按钮。当我单击该图标立即关闭日期选择器时，将触发“隐藏”事件，并且日期选择器将关闭。我想在那里停止事件传播，以便Angular（单击）事件在关闭后不会立即重新打开日期选择器。非常感谢您的帮助！

元素：

<div class="input-group date dp-textbox">
    <input type="text" class="form-control datepicker dp-input" />
    <i class="icon-appointment dp-icon" role="button" aria-label="Open Datepicker" (click)="openDp()"></i>
</div>

隐藏事件：

$(this.elementRef.nativeElement).find('.datepicker').datepicker().on('hide', (e) => {
      e.stopImmediatePropagation();
      console.log("this should be stopping propagation");
    });

点击事件：

openDp() {
    console.log("show this funciton");
    $(this.elementRef.nativeElement).find('.datepicker').datepicker('show');
  }