Ich verwende die date
Pipe, um mein Datum zu formatieren, aber ohne eine Problemumgehung kann ich nicht genau das gewünschte Format erhalten. Verstehe ich Pfeifen falsch oder ist das einfach nicht möglich?
//our root app component
import {Component} from 'angular2/core'
@Component({
selector: 'my-app',
providers: [],
template: `
<div>
<h2>Hello {{name}}</h2>
<h3>{{date | date: 'ddMMyyyy'}}, should be
{{date | date: 'dd'}}/{{date | date:'MM'}}/{{date | date: 'yyyy'}}</h3>
</div>
`,
directives: []
})
export class App {
constructor() {
this.name = 'Angular2'
this.date = new Date();
}
}
date
Pipe hat derzeit mehrere Probleme.Antworten:
Fehler beim Pipe-Datumsformat in Angular 2.0.0-rc.2, dieser Pull-Anforderung, behoben .
Jetzt können wir den herkömmlichen Weg gehen:
Beispiele:
Aktuelle Version:
Example Angular 8.x.x
Alte Versionen:
Example Angular 7.x
Example Angular 6.x
Example Angular 4.x
Example Angular 2.x
quelle
<input #dob="ngModel" [(ngModel)]="model.dob" [ngClass]="{ 'is-invalid': f.submitted && dob.invalid }" class="form-control" id="dob" name="dob" required type="date" />
Wie kann ich das beheben?Importieren Sie DatePipe aus Angular / Common und verwenden Sie den folgenden Code:
Dabei ist userdate Ihre Datumszeichenfolge. Sehen Sie, ob dies hilft.
Notieren Sie sich den Kleinbuchstaben für Datum und Jahr:
BEARBEITEN
Sie müssen eine
locale
Zeichenfolge als Argument an DatePipe im neuesten Winkel übergeben. Ich habe in Winkel 4.x getestetBeispielsweise:
quelle
Supplied parameters do not match any signature of call target.
aufnew DatePipe()
new DatePipe('en-US');
Sie können dies mit einem einfachen benutzerdefinierten Rohr erreichen.
Der Vorteil der Verwendung einer benutzerdefinierten Pipe besteht darin, dass Sie, wenn Sie das Datumsformat in Zukunft aktualisieren möchten, Ihre benutzerdefinierte Pipe aktualisieren können und sie überall wiedergibt.
Beispiele für benutzerdefinierte Rohre
quelle
Ich benutze Moment.js immer, wenn ich aus irgendeinem Grund Datumsangaben verwenden muss.
Versuche dies:
Und in der Ansicht:
quelle
moment
Bibliothek ist zu groß für einen kleinen Job wie das Format!Ich verwende diese temporäre Lösung:
quelle
Wenn jemand mit Zeit und Zeitzone sucht, ist dies für Sie
Fügen Sie am Ende des Datums- und Zeitformats z für die Zeitzone hinzu
quelle
Winkel: 8.2.11
Ausgabe: 9. Juni 1973
Ausgabe: 09/06/1973
Ausgabe: 06.09.1973 00:00 Uhr
quelle
Das einzige, was für mich funktioniert hat, wurde von hier inspiriert: https://stackoverflow.com/a/35527407/2310544
Für reines TT / MM / JJJJ funktionierte dies bei mir mit Winkel 2 Beta 16:
quelle
Wenn jemand das Datum mit der Uhrzeit in AM oder PM in Winkel 6 anzeigen kann, ist dies das Richtige für Sie.
Ausgabe
Vordefinierte Formatoptionen
Beispiele sind im Gebietsschema en-US angegeben.
Referenzlink
quelle
Ich denke, das liegt daran, dass das Gebietsschema in der fest codiert ist
DatePipe
. Siehe diesen Link:Derzeit gibt es keine Möglichkeit, dieses Gebietsschema durch Konfiguration zu aktualisieren.
quelle
Datumsangaben verhalten sich in Angular 2 mit Typescript für Safari unter MacOS und iOS nicht korrekt. Ich habe mich kürzlich mit diesem Problem befasst. Ich musste moment js hier verwenden, um das Problem zu lösen. Erwähnen, was ich kurz getan habe ...
Fügen Sie Ihrem Projekt das Paket momentjs npm hinzu.
Unter xyz.component.html (Beachten Sie hier, dass startDateTime vom Datentyp string ist)
{{ convertDateToString(objectName.startDateTime) }}
import * as moment from 'moment';
quelle
Weitere Informationen zur Datumsangabe finden Sie hier , z. B. Formate.
Wenn Sie es in Ihrer Komponente verwenden möchten, können Sie dies einfach tun
Jetzt können Sie einfach die Transformationsmethode verwenden, die es sein wird
quelle
Sie müssen die Gebietsschemazeichenfolge als Argument an DatePipe übergeben.
Vordefinierte Formatoptionen:
Datepipe in app.component.module.ts hinzufügen
quelle
Sie können auch momentjs für diese Art von Dingen verwenden. Momentjs ist am besten geeignet , Daten in JavaScript zu analysieren, zu validieren, zu bearbeiten und anzuzeigen.
Ich habe diese Pfeife von Urish verwendet, die für mich gut funktioniert:
https://github.com/urish/angular2-moment/blob/master/src/DateFormatPipe.ts
Im Parameter args können Sie Ihr Datumsformat wie folgt eingeben: "TT / MM / JJJJ"
quelle
In meinem Fall verwende ich in der Komponentendatei:
Und in der Komponente HTML-Datei
Es funktioniert gut für mich ;-)
quelle