2016-04-03 7 views
0

コントローラからng-modelの日付の値を取得しています。 10-22-2013のように日付をフォーマットしたいのですが、出力では日付形式を取得しています10/22/2013`ng-model`の日付オブジェクトから日付をフォーマットする方法

ここに日付をフォーマットする正しい方法は何ですか?

JS:

angular.module('dateInputExample', []) 
    .controller('DateController', ['$scope', function($scope) { 
     $scope.example = { 
     value: new Date(2013, 9, 22) 
     }; 
    }]); 

は、HTML:あなたの質問への応答がない純粋にHTML5を使用して

<form name="myForm" ng-controller="DateController as dateCtrl"> 
    <label for="exampleInput">Pick a date </label> 
    <input type="date" id="exampleInput" name="input" ng-model="example.value" 
     placeholder="yyyy-MM-dd" min="2013-01-01" max="2013-12-31" required /> 
    <div role="alert"> 
    <span class="error" ng-show="myForm.input.$error.required"> 
     Required!</span> 
    <span class="error" ng-show="myForm.input.$error.date"> 
     Not a valid date!</span> 
    </div> 

</form> 

Live Demo

+0

Punkerでテキストボックスの値が10-22-2013' 'として表示されている:

<p class="form-group"> <label>Result</label> <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="date" /> </p> 

とコントローラ上の

。 '10/22/2013'ではありません。あなたはそれが欲しいものではありませんか? – Roy

+0

はい、王です。別の答えがあればここに投稿してください – user2024080

答えて

2

。このlinkを参照してください。

私たちは、ワイヤ上のフォーマットと ブラウザのプレゼンテーション形式を区別する必要がフォーマット

を変更することが方法はありません。 YYYY-MM-DD:HTML5日付入力仕様1が に等しいフル日付形式を指定 RFC3339仕様2を指す

ワイヤフォーマット。詳細は の詳細についてRFC3339仕様のセクション5.6を参照してください。

プレゼンテーション形式ブラウザでは、入力時に の日付入力方法が制限されていません。執筆時点では、Chromeは最も幅広い日付の のサポート[3]を持っています。ユーザーのローカルカレンダー 形式を使用して日付選択ツールを表示します。 Opera(v10.6以降)では、日付選択ツールも表示されますが、 の日付がワイヤ形式で表示されます。 Firefox 44.0.2および などの他のブラウザInternet Explorer 9/10/11は、 形式のテキスト入力フィールドを表示します。私はangular-uiを使用することをお勧め

参照 http://tools.ietf.org/html/rfc3339 https://plus.google.com/102860501900098846931/posts/hTcMLVNKnec

http://www.w3.org/TR/html-markup/input.date.html。それはすべての角度を容易にするモジュールのきちんとした負荷があります。

ビュー内のマークアップは次のようになります。

angular.module('ui.bootstrap.demo').controller('DateParserDemoCtrl', function ($scope, uibDateParser) { 
    $scope.format = 'MM-dd-yyyy'; 
    $scope.date = new Date(); 
}); 
関連する問題