基本的に、次のような HTML5 日付ピッカーがあります。
<input class="form-control" type="date" [(ngModel)]="startDate" />
そして、次のようにモデルからの日付を表示する別の領域:
{{startDate | date:shortDate}}
私はそれがこの質問に関連しているとは思わないが、徹底的にするために、私は舞台裏でこの種のものを持っている:
private startDate: string;
private endDate: string;
updateDateFilter() {
let from = new Date(this.startDate);
let to = new Date(this.endDate);
**Stuff to filter based on date range**
}
それは素晴らしいです。もっと多くのことが起こっていますが、それはおそらく余分な詳細になるでしょう.
問題は、日付ピッカーをクリックして、たとえば、年を選択して削除を押すと、次のようになることです。
問題ありませんよね？Angular2 の日付パイプが混乱し、この驚くほど役立つエラー メッセージが表示された後、アプリ全体がクラッシュするためです。
元の例外: パイプ 'DatePipe' の無効な引数 ''
解決策は簡単に思えますが、どうすればよいかわかりません。DatePipe によって処理される前に日付文字列をキャッチし、その日、月、および年の有効なコンテンツがあることを確認するだけでよいと考えています。しかし、Angular2 は魔法のように動作し、モデル バインディングを使用して行われるため、介入への明確なルートはわかりません。
おそらく、DatePipe をオーバーライドして、その機能を維持しながら、最初に文字列をチェックする必要があります。方法がわかりません。その方法を知っている場合は、共有してください。代替アプローチも役に立ちます。日付が不完全なときにアプリをクラッシュさせることはできません。
ありがとう！