入力タイプ= "date" AngularJS ng-modelで前の日付を返します。どうして？

datepickerを使用して日付を選択すると、前日の日付が返されます。なぜそうなのか知りたい。それをどのように解決するか。入力タイプ= "date" AngularJS ng-modelで前の日付を返します。どうして？

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Example</title> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 
</head> 
<body ng-app=""> 
    <div> 
     <form novalidate class="simple-form"> 
      Date: <input type="date" ng-model="user.date" /><br /> 
     </form> 
     <pre>user = {{user}}</pre> 
    </div> 
</body> 
</html>

ここでは同じもののデモです。 Demo

おかげ

出典

2016-04-02 Kartik

私は...あなたが住んで推測してみましょうイギリスの東へ。 MDNから

：

引数が提供されていない場合、コンストラクタはシステムの設定に応じて、現在の日付と時刻のJavaScriptのDateオブジェクトを作成します。あなたは2016-04-02として日付を挿入すると

、それはあなたのローカル設定に応じて深夜にDateオブジェクトに変換されています。

JavaScript Dateオブジェクトは、プラットフォーム間で統一された動作を提供します。同じ時刻を表すために時間値をシステム間で受け渡すことができ、ローカルの日付オブジェクトを作成するために使用される場合は、時間のローカル相当を反映します。この均一な動作を提供するために

は、それはあなたの日付に添付タイムゾーンに関する情報をUTC（協定世界時）の日付に変換されます。

私はモルドバ（ヨーロッパ）に住んでおり、2015-05-15をあなたのプランナーに挿入すると、user = {"date":"2015-05-14T21:00:00.000Z"}となります。これは、モルドバがGMT+3タイムゾーンにあり、ここで深夜になると、UTC（またはGMT）によるとまだ9PM, 24th of Mayです。

ただし、日時文字列を挿入する可能性があり、正午の時刻を指定すると、同じ日になります。このplunker forkに2015-05-15T12:00:00を挿入し、自分で確認してください。

あなたはDate.UTC方法はありません日付作成したい場合：@iulian答えの助けを借りて

var d = new Date(); 
var utcDate = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()));

出典

2016-04-02 15:29:57 iulian

いいえ説明.. +1 ..既定の日付設定はありません、とにかくそのような 'Date.UTC'フォーマットはグローバルな方法で1つしか宣言できませんか？ –

@PankajParkar私が知る限り、そのような可能性はありません。 – iulian

それでは、どのようにして作業を開始しましたか？以下の回答で手動で日付を設定した後（日付の日付のずれは表示されません）ちょうど興味があることを知っている。ありがとう;） –

あなたのコードは、多くのミスがあります。

ng-app
が定義されていない
ng-controller

app.js

てみてください最初の日付を初期化する：

app.js

(function() { 
    'use strict'; 

    angular.module('myApp', []); 

    angular 
     .module('myApp') 
     .controller('MainCtrl', MainCtrl); 

    MainCtrl.$inject = ['$scope']; 

    function MainCtrl($scope) { 

     $scope.user = new Date(); 

    } 
}());

index.htmlを

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Example</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 
    <script src="app.js"></script> 
    </head> 
<body ng-app="myApp"> 
    <div ng-controller="MainCtrl"> 
    <form class="simple-form"> 
     Date: <input type="date" ng-model="user" /> 
    </form> 
    <pre>user = {{ user }}</pre> 
    </div> 
</body> 
</html>

Demo

出典

2016-04-02 15:13:07 ssuperczynski

はあなたplunkrを確認しました..私はOPが持っているものと同じ問題を再現することができます。.. –

おっと、plunkrを保存するのを忘れていました。完了しました – ssuperczynski

クール..それです.. +1、なぜあなたは説明できないのですか？＆new Date（） 'オブジェクトを初期化するだけでどのように動くのですか？ –

を、私は自分のゾーンに応じて必要な修正を知るようになりました。あなたのタイムゾーンに従って選択された日付を知りたければ、あなたのタイムゾーン@https://en.wikipedia.org/wiki/List_of_time_zones_by_countryをチェックアウトし、得られた日付文字列にその大きな違いを設定します。

たとえば、私はインドにいて、私のUTCタイムゾーンはUTC + 5：30です。正確な日時を取得するには、得られた結果に符号を付けて5時間30分を追加する必要があります。ここで

added 5.5(hrs)*60(minutes)*60(sec)*1000(miliseconds) as follows

$scope.user.date = new Date(+new Date($scope.user.date) + 5.5 * 60 * 60 * 1000);

同じのためのデモです。 Demo

タイムゾーンに応じて値を変更し、正確な値を取得します。

おかげ

出典

2016-04-05 12:36:57 Kartik

入力タイプ= "date" AngularJS ng-modelで前の日付を返します。どうして？

答えて

関連する問題