AngularJs: Показать название месяца с указанием номера месяца

Строка формата может состоять из следующих элементов для месяцев:

«ММММ»: месяц в году (январь-декабрь) - {{D_V | date:'yyyy-MMMM-dd'}}

«МММ»: месяц в году (Январь-декабрь) - {{D_V | date:'yyyy-MMM-dd'}}

«ММ»: с добавлением месяца в году (01-12) - {{D_V | date:'yyyy-MM-dd'}}

«М»: месяц в году (1-12 ) - {{D_V | date:'yyyy-M-dd'}}

Узнайте больше на Angular JS Date Filter

Ознакомьтесь с документацией по адресу http://docs.angularjs.org/api/ng.filter:date . Там вы увидите нужный формат:

{{date_expression | date:'MMMM'}}

Я нашел ответ. Проблема проста. Мы должны преобразовать дату в mysql в дату в формате javascript, тогда только вы можете отформатировать ее в javascript.

поэтому мой формат: 2008-04-25 00:00:00

  app.filter('format', function () {
          return function (item) {
               var t = item.split(/[- :]/);
           var d = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]);
           var time=d.getTime();                 
                   return time;
          };
        });

Я преобразовал mysql в javascript и затем в миллисекунды, затем применил мой фильтр к работе. Это может быть неэффективно , Это работает в отличной манере. Надеюсь, это кому-нибудь поможет.

Так что мой HTML:

<li  ng-repeat="x in names">
                <div class="date">
                <span class="day">{{ x.created_at | format | date:'d'}}</span>
                <span class="month">{{ x.created_at | format | date:'MMM'}}</span>
                </div>
                <p><a href="#">{{ x.study_description | makeUppercase}}</a></p>
            </li>

Работает нормально. @Nishanth ответ дает мне неопределенный. Я проголосовал за это, так как кажется, что он работает нормально для некоторых людей. Поддержка формата даты также зависит от инструментов браузера.

Если у вас есть индекс месяца, вы можете просто создать свой собственный фильтр:

myApp.filter('monthName', [function() {
    return function (monthNumber) { //1 = January
        var monthNames = [ 'January', 'February', 'March', 'April', 'May', 'June',
            'July', 'August', 'September', 'October', 'November', 'December' ];
        return monthNames[monthNumber - 1];
    }
}]);

Тогда в вашем шаблоне:

{{date_expression | monthName}}

angular.module('demo', [])
  .controller('DemoCtrl', ['$scope', '$filter', 'lodash', function($scope, $filter, _) {
    $scope.monthNames = _.range(12).map(function(m) {
        return $filter("date")(new Date(0, m), 'MMMM'); }); 
    }]);

Я использую lodash , чтобы получить диапазон чисел от 0 до 11, но вы можете легко получить этот список другим способом.

Посмотрев на исходный код фильтра даты в Angular's filters.js, я заметил, что Angular хранит список месяцев в $locale.DATETIME_FORMATS.MONTH. Вы можете использовать его для создания очень эффективного фильтра:

var app = angular.module("app", []); 

app.filter("month", function($locale) {
    return function(month) {
        return $locale.DATETIME_FORMATS.MONTH[month];
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
    <p ng-repeat="num in [0,1,2,3,4,5,6,7,8,9,10,11]">
       <span ng-bind="$index + 1"></span>: 
       <span ng-bind="$index | month"></span>
    </p>
</div>

Или отказаться от фильтра и положить его в вместо контроллера:

var app = angular.module("app", []); 

app.controller("ctrl", function($scope, $locale) {
    $scope.months = $locale.DATETIME_FORMATS.MONTH;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
    <p ng-repeat="num in [0,1,2,3,4,5,6,7,8,9,10,11]">
       <span ng-bind="$index + 1"></span>: 
       <span ng-bind="months[$index]"></span>
    </p>
</div>

Или даже в качестве директивы. Это может быть излишним, но HTML выглядит довольно (для меня):

var app = angular.module("app", []);

app.directive("month", function($locale) {
    return {
        restrict: "A",
        link: function ($scope, elem, atrs) {
            $scope.$watch(atrs.month, function(month) {
                elem.text($locale.DATETIME_FORMATS.MONTH[month]);
            });
        }
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
    <p ng-repeat="num in [0,1,2,3,4,5,6,7,8,9,10,11]">
       <span ng-bind="$index + 1"></span>: 
       <span month="$index"></span>
    </p>
</div>

Используйте MM, чтобы получить месяц в числовом формате

{{message.end_date | date : "dd-MM-y"}} 

Это даст вам результат 12-01-2017

Действительно, самый простой метод - это сочетание двух других ответов, опубликованных здесь. Использование фильтра в фильтре для получения конверсии и отображения названия месяца в текущем языковом наборе:

app.filter('monthname',['$filter',function($filter){
    return function(month) {
      return $filter("date")(new Date(0,month),'MMMM');
    }
}]);

Теперь вы можете использовать этот способ {{ 3 | monthname }}

Обратите внимание, что без этого исходный фильтр {{ 3 | date:'MMMM' }} не будет работать, так как в качестве аргумента ожидается тип Date, а не число.

Я понимаю, что у вас месяц является целочисленным значением, а не объектом даты. Фильтр даты работает только с форматированной датой или миллисекундой как строки, миллисекунды как целое число или объект Date.

Таким образом, вам нужно преобразовать целочисленное значение этого месяца во что-то, что понимает фильтр. Вы можете взять целочисленное значение месяца и сделать его нулевым, а затем создать из него новый фиктивный объект Date, а затем применить к нему фильтр Date.

Контроллер:

angular.module('demo', [])
  .controller('DemoCtrl', function($scope) {
      // here's the original value
      $scope.month = 0; // 0 for january, 11 for december

      // watch for changes to the value of month. turn it into a new date object that angular can bind and filter in the view
      $scope.$watch('month', function(val) {
        // note: if you are expecting the month value to be one-indexed, you'll need to subtract 1 from val to make it zero-indexed as Date expects
        $scope.date = new Date(2014, val);
      });
    });

Просмотр:

{{ date | date:'MMMM' }}

См. Этот пример .

Другой вариант - использовать сервис $filter напрямую, если вам нужен более прямой способ преобразования значения. Вы делаете в основном то же самое, просто форматируя значение в контроллере, а не в представлении.

Контроллер:

// Code goes here
angular.module('demo', [])
  .controller('DemoCtrl', function($scope, $filter) {
      // here's the original value
      $scope.month = 0;

      // watch for changes to the value of month, and then format it directly
      $scope.$watch('month', function(val) {
        $scope.date = $filter('date')(new Date(2014, val), 'MMMM');
      });
    });

Просмотр:

{{ date }}

Альтернативный пример