回答:
最初にコントローラーで日付オブジェクトを作成する必要があります。
コントローラ:
function Ctrl($scope)
{
$scope.date = new Date();
}
見る:
<div ng-app ng-controller="Ctrl">
{{date | date:'yyyy-MM-dd'}}
</div>
日付を印刷するたびに現在のスコープに日付オブジェクトをアタッチする必要がない場合は、フィルターを使用してこれを行うこともできます。
.filter('currentdate',['$filter', function($filter) {
return function() {
return $filter('date')(new Date(), 'yyyy-MM-dd');
};
}])
そしてあなたの見解では:
<div ng-app="myApp">
<div>{{'' | currentdate}}</div>
</div>
テンプレート
<span date-now="MM/dd/yyyy"></span>
指令
.directive('dateNow', ['$filter', function($filter) {
return {
link: function( $scope, $element, $attrs) {
$element.text($filter('date')(new Date(), $attrs.dateNow));
}
};
}])
Date
テンプレートではインラインオブジェクトに直接アクセスできないため(インラインソリューションの場合)、このディレクティブを選択しました。また、コントローラーをクリーンに保ち、再利用できます。
ええと、口ひげの表現({{Date.now() | date:'dd.MM.yyyy HH:mm:ss'}}
)でそれを行うことができます。この式を評価するスコープにDateオブジェクトを割り当てるだけです。
次にjsfiddleの例を示します。jsfiddle
ただし、値が自動的に更新されるとは期待しないでください。この値は角度では監視されないため、ダイジェストを更新するたびに(たとえば$ intervalで)トリガーする必要があります...これはリソースの浪費です(ドキュメントでも「推奨」されていません)。もちろん、ディレクティブ/コントローラーと組み合わせて子スコープのみをいじくりまわすことができます(たとえば、rootScopeよりも常に小さく、ダイジェストはより速くなります)。
誰かがこれに遭遇した場合に備えて、ちょうど私の2セント:)
ここで私が提案していることは、現在の回答と同じ結果になりますが、ここで述べた方法でコントローラーを作成することをお勧めします。
最初の「メモ」への参照スクロール(アンカーがないので、申し訳ありません)
推奨される方法は次のとおりです。
コントローラ:
var app = angular.module('myApp', []);
app.controller( 'MyCtrl', ['$scope', function($scope) {
$scope.date = new Date();
}]);
見る:
<div ng-app="myApp">
<div ng-controller="MyCtrl">
{{date | date:'yyyy-MM-dd'}}
</div>
</div>
AngularJSでmoment()
とformat()
関数を使用できます。
コントローラ:
var app = angular.module('demoApp', []);
app.controller( 'demoCtrl', ['$scope', '$moment' function($scope , $moment) {
$scope.date = $moment().format('MM/DD/YYYY');
}]);
見る:
<div ng-app="demoApp">
<div ng-controller="demoCtrl">
{{date}}
</div>
</div>
<script type="text/javascript">
var app = angular.module('sampleapp', [])
app.controller('samplecontrol', function ($scope) {
var today = new Date();
console.log($scope.cdate);
var date = today.getDate();
var month = today.getMonth();
var year = today.getFullYear();
var current_date = date+'/'+month+'/'+year;
console.log(current_date);
});
</script>
これがあなたの答えのサンプルです:http : //plnkr.co/edit/MKugkgCSpdZFefSeDRi7?p=preview
<span>Date Of Birth: {{DateOfBirth | date:"dd-MM-yyyy"}}</span>
<input type="text" datepicker-popup="dd/MM/yyyy" ng-model="DateOfBirth" class="form-control" />
そしてコントローラで:
$scope.DateOfBirth = new Date();
フィルターを使用することによる@Nick G.のものと同様のソリューションですが、パラメーターを意味のあるものにします。
relativedate
与えられたパラメータによって現在の日付に関連する日付をdiffとして計算するというフィルタを実装します。結果として、(0 | relativedate)
今日を(1 | relativedate)
意味し、明日を意味します。
.filter('relativedate', ['$filter', function ($filter) {
return function (rel, format) {
let date = new Date();
date.setDate(date.getDate() + rel);
return $filter('date')(date, format || 'yyyy-MM-dd')
};
}]);
そしてあなたのhtml:
<div ng-app="myApp">
<div>Yesterday: {{-1 | relativedate}}</div>
<div>Today: {{0 | relativedate}}</div>
<div>Tomorrow: {{1 | relativedate}}</div>
</div>
別の方法は次のとおりです。コントローラで、次のように現在の日付を保持する変数を作成します。
var eventsApp = angular.module("eventsApp", []);
eventsApp.controller("EventController", function EventController($scope)
{
$scope.myDate = Date.now();
});
HTMLビューでは、
<!DOCTYPE html>
<html ng-app="eventsApp">
<head>
<meta charset="utf-8" />
<title></title>
<script src="lib/angular/angular.js"></script>
</head>
<body>
<div ng-controller="EventController">
<span>{{myDate | date : 'yyyy-MM-dd'}}</span>
</div>
</body>
</html>
Date.now()
。