Angularjs - отображение текущей даты

Я получил представление в angularjs, и я просто пытаюсь отобразить текущую дату (отформатирован). Я подумал что-то вроде <span>{{Date.now() | date:'yyyy-MM-dd'}}</span> <span>{{Date.now() | date:'yyyy-MM-dd'}}</span> должен отображать текущую дату.

Ответ 1

Сначала вы должны создать объект даты в своем контроллере:

контроллер:

function Ctrl($scope)
{
    $scope.date = new Date();
}

Посмотреть:

<div ng-app ng-controller="Ctrl">
    {{date | date:'yyyy-MM-dd'}}
</div>

Пример JSFiddle

Угловой фильтр даты

Ответ 2

Вы также можете сделать это с помощью фильтра, если вы не хотите прикреплять объект даты к текущей области каждый раз, когда вы хотите распечатать дату:

.filter('currentdate',['$filter',  function($filter) {
    return function() {
        return $filter('date')(new Date(), 'yyyy-MM-dd');
    };
}])

а затем, на ваш взгляд,

<div ng-app="myApp">
    <div>{{'' | currentdate}}</div>
</div>

Ответ 3

шаблон

<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 в шаблоне (для встроенного решения), я выбрал эту Директиву. Он также позволяет вашим контроллерам чистить и повторно использовать.

Ответ 4

Ну, вы можете сделать это с выражением усы ({{Date.now() | date:'dd.MM.yyyy HH:mm:ss'}}). Вам просто нужно назначить объект Date в область, в которой вы хотите оценить это выражение.

Вот пример jsfiddle: jsfiddle

Но не ожидайте, что он автоматически обновит значение. Это значение не отслеживается угловым, поэтому вы должны запускать дайджест каждый раз, когда вы хотите его обновить (например, с помощью интервала $)... что является пустой тратой ресурсов (а также не "рекомендуется" в документах). Разумеется, вы можете использовать комбинацию с директивами/контроллерами, чтобы обходиться только с помощью детской области (она всегда меньше, чем, например, rootScope и дайджест будет быстрее).

Ответ 5

Только мои 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>

Ответ 6

Вы можете использовать функции moment() и format() в AngularJS.

контроллер:

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>

Ответ 7

Вот пример вашего ответа: 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();

Ответ 8

Посмотреть

<div ng-app="myapp">
{{AssignedDate.now() | date:'yyyy-MM-dd HH:mm:ss'}}
</div>

контроллер

var app = angular.module('myapp', [])

app.run(function($rootScope){
    $rootScope.AssignedDate = Date;
})

Ответ 9

Решение, аналогичное решению @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>

Ответ 10

Другой способ сделать это: В контроллере создать переменную для хранения текущей даты, как показано ниже:

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>

Ответ 11

<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>