Question

Angularjs为格式化日期提供Date Filter。如何以下列格式获取日期？

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

我应该创建新的自定义过滤器，还是可以通过$filterProvider扩展日期过滤器的格式。这样做的最佳方式是什么？

Answer 1

为了做你需要的过滤器，你需要一个过滤器，当给定一个数字时提供序数，并且只有它自己的序数。 https://github.com/chrisiconolly/angular-all-ordinal-filters（完全免责声明：我自己的项目）就是这样做的。

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

<connectionStrings>
    <add name="IMDB" connectionString="Data Source=(LocalDb)\MSSQLLocalDB;Initial Catalog=IMDB;Integrated Security=True" providerName="System.Data.SqlClient" />
</connectionStrings>

将以下行添加到.html文件

bower install --save angular-all-ordinal

最后将模块添加为依赖项

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

Answer 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;
  }
});

Answer 3

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

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

Answer 4

编写自定义过滤器以实现此目的

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/

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

4 个答案: