Question

我完全按照文档所述导入了日期选择器

  <div class="form-group">
    <div class="input-group">
      <input class="form-control" placeholder="yyyy-mm-dd"
              name="date" [(ngModel)]="date" ngbDatepicker #d="ngbDatepicker" >
      <div class="input-group-append">
        <button class="btn btn-outline-secondary calendar" (click)="d.toggle()" type="button"></button>
      </div>
    </div>
  </div>

我相当确定我已按照指南进行了设置。

Answer 1

您需要手动放置图片，为此，我正在使用Font Awesome

<div class="col-sm-3">
    <div class="form-group">
        <label>Date:</label>
        <div class="input-group">
            <input name="date" class="form-control" ngbDatepicker #d="ngbDatepicker" [(ngModel)]="date" required />
            <span class="input-group-append">
                <button type="button" class="btn btn-outline-secondary btn-sm" (click)="d.toggle()">
                    <i class="fas fa-calendar-alt fa-fw"></i>
                </button>
            </span>
        </div>
    </div>
</div>

Answer 2

您还需要在error: package android.support.v7.app does not exist error: cannot find symbol class AppCompatActivity error: method does not override or implement a method from a supertype error: cannot find symbol variable super error: cannot find symbol method setContentView(int)

之后的组件样式表或index.html文件中添加以下CSS

bootstrap.css

在stackblitz中查看此官方示例

https://stackblitz.com/run?file=index.html

ng-bootstrap-日期选择器的图标未显示

2 个答案: