angularJS过滤日期

Question

我正在尝试使用过滤器来过滤掉作为字符串的日期。我从 API 获得的日期是

"/Date(1418716652000+0000)/"

我有一个函数可以将日期转换为我想要的类型：

1418716652000

函数是：

$scope.convertDate = function(published_first) {
    var date = (published_first.match(/\(.*\)/, ''));
    var convertedDate = date[0];
    date = eval(convertedDate.replace(/\//g,''));
    return date;
}

我的 HTML 是：

<div id ="news" ng-repeat="new in news | filter:convertDate">
  <h3 class="title" ng-repeat="n in new">
  <span>{{n.title}}</span><br/>
  <div class="title-data">              
    <span ng-if="n.byline.length > 0">by: {{n.byline}}</span>
    <br/>
    <span>
    <span>published: {{n.published_first | date:'medium'}}</span><br/>
    </span>
</div>  

我一直试图在我的 ng-repeat div 中的 HTML 中将其作为过滤器运行，但它不起作用。我还尝试在包含 angular date:'medium' 过滤器的同一跨度中运行过滤器。那也行不通。有人可以帮我解决我所缺少的吗？

Answer 1

您正在使用的 API 似乎向您提供了带有 published_first 属性的新闻对象，该属性采用您希望以不同方式呈现的传输格式，但该数据在运行后不会更改已收到。

在任何类型的手表中将标记转换为过滤器或函数意味着您会不断地转换触发摘要的每个事件的日期。最好从接收新闻项目的控制器或服务运行 convertDate() 函数，并在从 API 接收到的每个项目上进行转换。在这种情况下，每个新闻项从字符串到日期的转换只进行一次，然后您的标记变为：

<span>published: {{n.published_first | date:'medium'}}</span>

此外，如果您可以确定来自 API 的格式将始终保持一致（应该如此），您可以将一行转换为时间戳：

$scope.convertDate = function(published_first) {
    return parseInt(published_first.substr(6), 10); 
}

该行删除了 /Date( 的初始非数字字符并解析到第一个非数字字符，即 + 或 ) 取决于精度。

Answer 2

1) 创建一个过滤器函数，如图所示here。

module.filter('convertDate', function() {
  return function(published_first) {
    var date = (published_first.match(/\(.*\)/, ''));
    var convertedDate = date[0];
    date = eval(convertedDate.replace(/\//g,''));
    return date;
  };
})

2) 使用您的过滤器来格式化您的日期：

<div id ="news" ng-repeat="new in news">
  <h3 class="title" ng-repeat="n in new">
  <span>{{n.title}}</span><br/>
  <div class="title-data">              
    <span ng-if="n.byline.length > 0">by: {{n.byline}}</span>
    <br/>
    <span>
    <span>published: {{n.published_first | convertDate | date:'medium'}}</span><br/>
    </span>
</div>  

Answer 3

尽可能避免使用过滤器。 Filters can cause huge performance issues in large applications.

也就是说，既然你把函数放在作用域上，你就可以在标记中使用它：

<span>published: {{convertDate(n.published_first) | date:'medium'}}</span><br/>