扩展 angularjs 日期过滤器的日期格式答案

【问题标题】：Extending date formats for angularjs date filter扩展 angularjs 日期过滤器的日期格式
【发布时间】：2014-05-01 12:42:40
【问题描述】：

Angularjs 提供了一个Date Filter 用于格式化日期。如何获取以下格式的日期？

dd(st || nd || th) mm yyyy
1st May 2014
1<sup>st</sup> May 2014

我应该创建一个新的自定义过滤器还是可以通过$filterProvider 扩展日期过滤器的格式。最好的方法是什么？

【问题讨论】：

标签： javascript angularjs date

【解决方案1】：

为了在您需要一个过滤器之后执行您的操作，该过滤器在给定数字时提供序数，并且仅提供序数。 https://github.com/chrisiconolly/angular-all-ordinal-filters（完全免责声明：我自己的项目）就是这样做的。

按照自述文件将过滤器安装到您的项目中，此处为简短版本：

bower install --save angular-all-ordinal

将以下行添加到您的 .html 文件中

<script src="path/to/angular-all-ordinal.min.js"></script>

最后将模块添加为依赖项

angular.module('demo', ['ordinal'])

设置完成后，您可以通过将序数过滤器和日期过滤器链接在一起来一起使用它们。

<p>{{myDateObject | date:'dd'}}<sup>{{myDateObject | date:'dd' | ordinalOnly}}</sup> {{myDateObject | date :'MMMM yyyy'}}</p>

你最终会得到你想要的结果：

<p>1<sup>st</sup> May 2015</p>

【讨论】：

【解决方案2】：

我也有同样的要求，在这期间我登陆了这里，所以我在这里做了一些实验。看看

Fiddle Demo

var myApp = angular.module('myApp', []).filter('ordinal', function() {
  return function(input) {
    var date = new Date(input);
    var dayOfMonth = date.getDate();
    var suffix = dayOfMonth;
      var suffixes = ["th", "st", "nd", "rd"];
    var relevantDigits = (dayOfMonth < 30) ? dayOfMonth % 20 : dayOfMonth % 30;
      var suf = (relevantDigits <= 3) ? suffixes[relevantDigits] : suffixes[0];
    return  input+' '+suf;
  }
});

【讨论】：

【解决方案3】：

编写自定义过滤器来实现这一点

filter('ordinal', function() {
  return function(input) {
    var s=["th","st","nd","rd"],
    v=input%100;
    return input+(s[(v-20)%10]||s[v]||s[0]);
  }
});

在这里查看工作小提琴http://jsfiddle.net/trinathm/vF2gt/

【讨论】：

【解决方案4】：

正确，您可以创建自己的自定义过滤器，例如：

angular.module('', [])
  .filter('someFilter', function() {
    return function(input,param1) {
    ...

在您的 html 中，您需要做的就是使用任何其他过滤器，例如 {{somevalue | someFilter}}

回到您的日期问题，您可能知道的第二件事是您可以通过注入$filter 服务直接从代码中调用过滤器；这将使您可以从过滤器中获取任何值：

 var filteredDate = $filter('date')(new Date(input), 'dd MMMM');

综上所述，我认为这是我推荐的实现自定义过滤器的方法

 angular.module('', [])
      .filter('someFilter', function($filter) {
        return function(input) {
            var filteredYearMonth = $filter('date')(new Date(input), 'MMMM yyyy');
            var filteredDay = (new Date(input)).getDay();
            var arr = ['st', 'nd', 'rd']
            var myDate  arr[filteredDay] || "th" + filteredYearMonth;

            return myDate
        ...

【讨论】：