angular 2 - モジュール式の日付ピッカーコンポーネントを作成する

Question

私は移籍時に読んでいましたが、どこにでもドロップできるポップアップピッカーサービスを作るために必要なものかどうかを確かめようとしています。

ngx-bootstrapはまだモーダル日付ピッカーをサポートしていないので、私は自分で作っています。 私はアプリ全体で複数の日付ピッカーを持っています。同じページでも複数の日付ピッカーがあるので、できるだけモジュール式にしたいと思っています。私は標準の日付入力で始まる

：現時点では

<input 
    type="date" 
    class="form-control" 
    (click)="pickDate($event, '#requestDate')" /> 

は、私の日付ピッカーは、右ページ（それがポップアップのように振る舞うので、絶対postioned）である：

<datepicker 
    id="requestDate" 
    name="requestDate" 
    [(ngModel)]="incident.absence.requestDate" 
    required></datepicker> 

。 ..しかし私は私のサービスがそれを必要に応じて生成すると期待しています。

これまでの方法：前後に入力し、DatePickerのINITを渡すと更新日の間の通信の多くがあるように起こって

pickDate(e, popupId) { 
    e.preventDefault(); 
    var popupCtrl = this.elementRef.nativeElement.querySelector(popupId); 
    popupCtrl.style.display= 'block'; 
} 

。おそらく、simple transclusionで十分ではありません。

私のページでコントロールを生成するサービスはどのように機能しますか？

（または私はここに、ホイールを発明し、再度のですか？）

Answer 1

あなたはあなたがする必要があるよりも、より多くの仕事のように聞こえる日付ピッカーのための独自のラッパーを書くことができますが。あなたがすでにngx-bootstrapを使っているように聞こえるので、カスタムの日付ピッカーが本当に必要な場合は、日付ピッカーをドロップダウンやツールヒントコントロールに入れてください。

現実的に、私はprimengから日付ピッカーを使用します。https://www.primefaces.org/primeng/#/calendar

それはあまり重要で最も膨張があなたPRODビルドで振盪しなければならないので、あなたが複数のUIフレームワーク（primengとNGX-ブートストラップ）を使用しているということではないはず。