相关疑难解决方法(0)

弹出窗口中的Angular bootstrap日期范围选择器?

我正在尝试使用ng-bootstrap在我的角度应用程序中显示日期范围选择器.我的代码如下所示:

<ngb-datepicker #dp ngModel (ngModelChange)="onDateChange($event)" [displayMonths]="2" [dayTemplate]="t">
            </ngb-datepicker>

            <ng-template #t let-date="date" let-focused="focused">
              <span class="custom-day"
                    [class.focused]="focused"
                    [class.range]="isFrom(date) || isTo(date) || isInside(date) || isHovered(date)"
                    [class.faded]="isHovered(date) || isInside(date)"
                    (mouseenter)="hoveredDate = date"
                    (mouseleave)="hoveredDate = null">
                {{ date.day }}
              </span>
            </ng-template>
Run Code Online (Sandbox Code Playgroud)

如何在弹出窗口中显示上述范围选择器?

根据答案,我尝试了以下操作,但点击时看不到弹出窗口:

 <!-- Button trigger modal -->
          <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
            Pick Date Range
           </button>

    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Optional title</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button> …
Run Code Online (Sandbox Code Playgroud)

popup bootstrap-4 ng-bootstrap angular

4
推荐指数
2
解决办法
3889
查看次数

标签 统计

angular ×1

bootstrap-4 ×1

ng-bootstrap ×1

popup ×1