【问题标题】:angularjs moment parse formatangularjs矩解析格式
【发布时间】:2017-05-14 21:36:08
【问题描述】:

我有一个显示以下表达式的 ng-repeat

{{date}} // 2-1-2017

当我使用角矩时

{{date | amDateFormat:'DD'}} 

我得到 1,我期待 2。如何让时刻知道我的格式实际上是 dd-mm-yyyy 而不是 mm-dd-yyy 在视图中?我不想在控制器级别解析它,因为它很复杂。

【问题讨论】:

  • date 变量(日期、字符串、时刻对象)的类型是什么?控制台中有警告吗?

标签: javascript angularjs datetime momentjs angular-moment


【解决方案1】:

我认为您的问题可能与您构建日期对象的方式有关

new Date("2-1-2017") ; // Wed Feb 01 2017

如果我这样做,1 表示日期,这是正确的。 日期过滤器根据接收到的对象解析日期,您应该为输入日期寻找正确的日期格式。

【讨论】:

    【解决方案2】:

    如果您的输入为:

    • JavaScript 日期对象
    • 代表毫秒的数字(也可以是字符串)
    • ISO 8601 格式的字符串(例如yyyy-MM-ddTHH:mm:ss.sssZ、yyyy-MM-dd 等)

    您的date 是一个非 ISO 8601 格式的字符串,因此您必须更改将2-1-2017 解析为日期的方式。

    您可以使用moment(String, String) 在控制器中解析您的字符串,如下例所示:

    angular.module('MyApp',['angularMoment'])
    .controller('AppCtrl', function($scope) {
      $scope.dates = [
        // Wrong way to parse string
        moment('2-1-2017').toDate(),
        // Parse string specifying format
        moment('2-1-2017', 'D-M-YYYY').toDate()
      ];
    });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.1/angular-moment.min.js"></script>
    
    <div ng-app="MyApp" ng-controller="AppCtrl">
      <div ng-repeat="date in dates">
        <span>angular-moment: {{date | amDateFormat:'DD'}}</span>
        <span>angular date filter: {{date | date:"dd"}}</span>
      </div>
    </div>

    如果您不想修改控制器,可以使用角力矩amParse 过滤器。正如文档所说,这个过滤器:

    将自定义格式的日期解析为可与am-time-ago 指令和其他过滤器一起使用的时刻对象。

    因此,在您的情况下,您可以使用以下示例中显示的代码:

    angular.module('MyApp',['angularMoment'])
    .controller('AppCtrl', function($scope) {
      $scope.dates = [
        '2-1-2017', // February 2 2017
        '15-1-2017' // January 15 2017
      ];
    });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.1/angular-moment.min.js"></script>
    
    <div ng-app="MyApp" ng-controller="AppCtrl">
      <div ng-repeat="date in dates">
        <span>angular-moment: {{date | amParse:'D-M-YYYY' | amDateFormat:'DD'}}</span>
      </div>
    </div>

    【讨论】:

      【解决方案3】:

      根据文档,AngularJs 有一个内置的filter for date 可以与以下集合一起使用:

      {{ date_expression | date : format : timezone}}
      

      这样你就可以像这样使用它:

      {{ date | date:'dd-MM-yyyy'}}
      

      但是,如果您使用时刻的日期过滤器,它必须是时刻日期(即定义了时区的完整日期)对象,您可以像 angular 一样过滤它。

      {{ date | amDateFormat:'dd-MM-yyyy' }}
      

      【讨论】:

      • 我只想显示日期,比如 2。
      • 你的意思是我使用 angularjs 日期过滤器来格式化并用时刻做一些事情?
      • @JessieEmerson 您可以使用 de format 参数作为'dd',所以实际上您的日期对象以及解析其格式的方式可能存在问题。
      • 日期实际上是一个字符串。
      • @JessieEmerson date = new Date('2-1-2017'); 怎么样?
      【解决方案4】:

      您应该使用角度过滤器,例如:

      {{date | date:'dd-MM-yyyy'}}
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-04-19
        • 2021-12-25
        • 2021-11-10
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多