Format Datum und Uhrzeit in AngularJS

Wie zeige ich Datum und Uhrzeit in AngularJS richtig an?

Die folgende Ausgabe zeigt sowohl die Eingabe als auch die Ausgabe mit und ohne AngularJS-Datumsfilter:

In: {{v.Dt}}  
AngularJS: {{v.Dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

Dies druckt:

In: 2012-10-16T17:57:28.556094Z 
AngularJS: 2012-10-16T17:57:28.556094Z

Das gewünschte Anzeigeformat ist 2010-10-28 23:40:23 0400oder2010-10-28 23:40:23 EST

v.Dt ist wahrscheinlich kein Date () -Objekt.

Siehe http://jsfiddle.net/southerd/xG2t8/

aber in Ihrem Controller:

scope.v.Dt = Date.parse(scope.v.Dt);

Der Code sollte funktionieren , wie Sie es sehen haben diese Geige .

Sie müssen jedoch sicherstellen, dass v.Dtes sich um ein geeignetes Datumsobjekt handelt , damit es funktioniert.

{{dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

oder wenn dateFormat im Gültigkeitsbereich als dateFormat = 'JJJJ-MM-TT HH: mm: ss Z' definiert ist:

{{dt | date:dateFormat }}

Ich weiß, dass dies ein alter Gegenstand ist, dachte aber, ich würde eine andere Option in Betracht ziehen.

Da die ursprüngliche Zeichenfolge den Demarker "T" nicht enthält, erkennt die Standardimplementierung in Angular ihn nicht als Datum. Sie können es mit einem neuen Datum erzwingen, aber das ist ein bisschen schmerzhaft für ein Array. Da Sie Filter zusammen leiten können, können Sie möglicherweise einen Filter verwenden, um Ihre Eingabe in ein Datum zu konvertieren und dann den Filter date: auf das konvertierte Datum anzuwenden. Erstellen Sie einen neuen benutzerdefinierten Filter wie folgt:

app
.filter("asDate", function () {
    return function (input) {
        return new Date(input);
    }
});

Dann können Sie in Ihrem Markup die Filter zusammen leiten:

{{item.myDateTimeString | asDate | date:'shortDate'}}

Sie können den 'Datums'-Filter folgendermaßen erhalten:

var today = $filter('date')(new Date(),'yyyy-MM-dd HH:mm:ss Z');

Dadurch erhalten Sie das heutige Datum in dem von Ihnen gewünschten Format.

Hier ist ein Filter , der eine Datumszeichenfolge ODER ein Javascript-Date () -Objekt verwendet. Es verwendet Moment.js und kann jede Moment.js- Transformationsfunktion anwenden , z. B. die beliebte Funktion 'fromNow'.

angular.module('myModule').filter('moment', function () {
  return function (input, momentFn /*, param1, param2, ...param n */) {
    var args = Array.prototype.slice.call(arguments, 2),
        momentObj = moment(input);
    return momentObj[momentFn].apply(momentObj, args);
  };
});

So...

{{ anyDateObjectOrString | moment: 'format': 'MMM DD, YYYY' }}

würde den 11. November 2014 anzeigen

{{ anyDateObjectOrString | moment: 'fromNow' }}

würde anzeigen 10 Minuten

Wenn Sie mehrere Momentfunktionen aufrufen müssen, können Sie sie verketten. Dies konvertiert in UTC und formatiert dann ...

{{ someDate | moment: 'utc' | moment: 'format': 'MMM DD, YYYY' }}

https://gist.github.com/cmmartin/341b017194bac09ffa1a

Hier einige beliebte Beispiele:

<div>{{myDate | date:'M/d/yyyy'}}</div> 04.07.2014

<div>{{myDate | date:'yyyy-MM-dd'}}</div> 2014-07-04

<div>{{myDate | date:'M/d/yyyy HH:mm:ss'}}</div> 04.07.2014 12:01:59

Haben Sie den Abschnitt Schreibanweisungen (Kurzversion) der Dokumentation gesehen ?

HTML

<div ng-controller="Ctrl2">
      Date format: <input ng-model="format"> <hr/>
      Current time is: <span my-current-time="format"></span>
</div> 

JS

function Ctrl2($scope) {
  $scope.format = 'M/d/yy h:mm:ss a';
}

Innerhalb eines Controllers kann das Format durch Einfügen von $ filter gefiltert werden.

var date = $filter('date')(new Date(),'MMM dd, yyyy');

Wenn Sie wie "30.01.2017 16:31:20" ausgeben möchten, folgen Sie einfach dem einfachen Schritt

Schritt 1 - Deklarieren Sie die folgende Variable in js controller

$scope.current_time = new Date();

step2- Anzeige in HTML-Seite wie

{{current_time | Datum: 'mittel'}}

Wir können das Datum auf der Ansichtsseite sehr einfach in einem Winkel formatieren. Bitte überprüfen Sie das folgende Beispiel:

{{dt | Datum: "TT-MM-JJJJ"}}

Sie können momentjsden Datums- / Zeitfilter in anglejs implementieren. Beispielsweise:

angular.module('myApp')
 .filter('formatDateTime', function ($filter) {
    return function (date, format) {
        if (date) {
            return moment(Number(date)).format(format || "DD/MM/YYYY h:mm A");
        }
        else
            return "";
    };
});

Wo Datum im Zeitstempelformat ist.

In $filterAbhängigkeit in der Steuerung.

var formatted_datetime = $filter('date')(variable_Containing_time,'yyyy-MM-dd HH:mm:ss Z')

Ich würde Ihnen empfehlen, moment.js zu verwenden. Es hat eine gute Unterstützung für die Datumsformatierung nach Gebietsschemas.

Erstellen Sie einen Filter, der intern die moment.js-Methode zum Formatieren des Datums verwendet.