日付ポップアップをテキストフィールドの下に設定する方法

Question

私は、日付フィールドをクリックすると日付フィールドの下に来る必要があります。

は、ここで私はngModel機能を使用するために持っているか、私は結果を達成するために、ピッカープラグインコンポーネントで書く必要があるかどうか私のコード

<div class="col-3"> 
    <div class="form-group calenderForm calenderForm1"> 
    <label for="templateName">REPAIR DATE (FROM)</label> 
    <owl-date-time name="repairDateFrom" 
     [(ngModel)]="repairDateFrom" 
     [max]="max" 
     [type]="'calendar'" 
     [dateFormat]="'YYYY-MM-DD'" 
     [placeHolder]="'YYYY-MM-DD'" 
     ></owl-date-time> 
     <div class="error-message-block"></div> 
    <input type="hidden" name="repairDateFrom" id = "repairDateFrom" 
    value="{{repairDateFrom | date: 'yyyy-MM-dd'}}" 
    (click)="closeDatePopUp()"/> 
    </div> 
    </div> 

です。 どうすれば達成できるのか教えてください。

Answer 1

ng2-popoverのインストールが最も簡単です。ポップオーバーはブートストラップを使用する角型アプリケーション向けですが、ブートストラップなしで使用したくない場合は、単に独自のcssクラスを作成してください。 Popoverはjqueryに依存しません。

Angularのために動力を与えられたブートストラップ4を使用している場合、あなたはボックスからのポップオーバーを実装することができます。 Quick and easy popovers

<input type="input" placement="bottom" 
     ngbPopover="Popover text." popoverTitle="Popover on bottom">