2013-11-21 8 views
93

誰でもこの1387843200000フォーマットから日付をこの24/12/2013に変換する方法を教えてください。AngularJS - コントローラの日付を変換する

input type="date"フィールドを含む編集フォームへのバインドが全く行われていない場合は、この方法での日付が保存されます。

#Plunker demo here.

EditCtrl

app.controller("EditCtrl", [ "$scope", "$filter", "db" function ($scope, $filter, db){ 

    // this gets me an item object 
    var item = db.readItem(); 

    // item date = 1387843200000 
    // this returns undefined 
    item.date = $filter('date')(date[ item.date, "dd/MM/yyyy"]); 

}]); 

Edit.html - テンプレート

<form name="editForm" class="form-validate"> 

     <div class="form-group"> 
      <label for="date">Event date.</label> 
      <input type="date" class="form-control" ng-model="event.date" id="date" required /> 
     </div> 

     <a href="#/" class="btn btn-danger ">Cancel</a> 
     <button id="addEvent" class="btn btn-primary pull-right" ng-disabled="isClean() || editForm.$invalid" ng-click="saveEvent()">Save event.</button> 

    </form> 
+1

なぜコントローラで変換する必要がありますか?表示可能な値が必要な場合は、日付フィルタを使用してビュー内の日付をフォーマットすることができます。 –

+0

@JustinNiessner - 日付はこのように&input type = "date"フィールドの編集フォームにバインドするときに格納されます – Iladarsda

+1

moment.js angularjs date timeフィルタを使うことができます - https://github.com /尿意/角速度 – virender

答えて

188
item.date = $filter('date')(item.date, "dd/MM/yyyy"); // for conversion to string 

http://docs.angularjs.org/api/ng.filter:date

HTML5 type = "date"を使用している場合は、ISO形式yyyy-MM-ddを使用する必要があります。

item.dateAsString = $filter('date')(item.date, "yyyy-MM-dd"); // for type="date" binding 


<input type="date" ng-model="item.dateAsString" value="{{ item.dateAsString }}" pattern="dd/MM/YYYY"/> 

http://www.w3.org/TR/html-markup/input.date.html

注:クローム31で=「」タイプ=「日付は」非標準に見えるパターンを使用するが、期待通りに動作しているように見えます

+0

ありがとうございます。 ISO形式と文字列形式は素晴らしいヒントです。私はこれに気をつけます。 – Iladarsda

+0

こんにちは、私は提案として実装しようとしましたが、それは私のために働いていません。 – Mukun

+0

こんにちは、私は提案として実装しようとしましたが、それは私のために働いていません。春のwebserviceからの私の返答は、{"basicPersonalInfo":{"empNo": "04005001"、 "dob":490645800000}、 "communicationInfo":null}で、私はそれを私のブートストラップ/ HTML5日付入力フィールドに表示する必要があります。私はコントローラのフィルタを\t $ scope.basicInfo = BasicInformationService.query()のように使用しました。 \t \t \t $ scope.basicInfo。$ promise.then(関数(データ){\t \t \t \t \t $ scope.basicInfo.basicPersonalInfo.dob = $フィルタ( '日付')(data.basicPersonalInfo.dob、「YYYY-MM -dd "); });どのような助けがありがたいです – Mukun

16

作成filter.jsあなたは、再利用可能な

angular.module('yourmodule').filter('date', function($filter) 
{ 
    return function(input) 
    { 
     if(input == null){ return ""; } 
     var _date = $filter('date')(new Date(input), 'dd/MM/yyyy'); 
     return _date.toUpperCase(); 
    }; 
}); 

ビュー

<span>{{ d.time | date }}</span> 
0としてこれを行うことができます

またはコントローラで

var filterdatetime = $filter('date')(yourdate); 

Date filtering and formatting in Angular js.

+1

AngularJSに既に日付フィルタが組み込まれているようです:https://docs.angularjs.org/api/ng/filter/date –

+0

ありがとうございました!私のために新しい日付を使用して、そのトリックをしました。 – butYouDontLookLikeADeveloper

1

あなたがオブジェクトにdateとして保存するdateAsStringをバックに変更する必要がありますので、ここですべてのソリューションは、実際に入力するモデルを結合しない(でフォームの後にコントローラーが提出されます)。

あなたは単純な可能性結合効果を必要としませんが、ちょうど入力して、それを表示するには、

場合:

<input type="date" value="{{ item.date | date: 'yyyy-MM-dd' }}" id="item_date" /> 

次に、あなたが好きな場合は、コントローラに、あなたはこのように編集された日付を保存することができます:

$scope.item.date = new Date(document.getElementById('item_date').value).getTime(); 

は注意してください。コントローラ内のの場合は、item変数を$scope.itemと宣言する必要があります。

1

私はJavaScriptでお勧め:

var item=1387843200000; 
var date1=new Date(item); 

、その後、日付1日付です。

+0

はい、現在のタイムスタンプに変換したいところです –