web-dev-qa-db-ja.com

Angular 2+ DatePipe形式でテキストを含める

Angular 2。でDatePipeを使用しようとしています。出力日を08/23/2017 at 11:07 AMの形式にします。

ただし、テキストatを日付形式に含める適切な方法がわかりません。

そのようにフォーマットを指定する場合:{{my_date | date:'MM/dd/yyyy at hh:mm a'}}

取得:08/23/2017 AMt 11:07 AM

テキストを引用符で囲んでみました:{{my_date | date:'MM/dd/yyyy "at" hh:mm a'}}

しかし、それは出力に引用符を追加しただけです:08/23/2017 "AMt" 11:07 AM

これを行う唯一の方法は、{{my_date | date: 'MM/dd/yyyy}} at {{my_date | date: 'hh:mm a'}}のような形式の2つの側面を持つ2つの別々のパイプに分割することですか?

または、aの代わりにテキストatを表示するように、atAMtをエスケープする方法はありますか?

11
Andrew Mairose

私はまさにこの状況にありました。リテラルテキストを\'で囲むことにより、それを機能させることができました。

{{my_date | date: 'yyyy/MM/dd \'at\' HH:mm:ss'}}

19
cooljeffro

簡単なパイプを作成できるかもしれませんが、

@Pipe({
    name: 'dateFormatPipe',
})
export class dateFormatPipe implements PipeTransform {
    transform(value: string) {
       var datePipe = new DatePipe("en-US");
        value = datePipe.transform(value, 'MMM-dd-yyyy') + ' at ' + datePipe.transform(value, 'hh:mm a');
        return value;
    }

}

<p>{{currentTime | dateFormatPipe}}</p>

Ref1Ref2

0
Prashobh