javascript - Angular 中的全局变量

Question

我有一些日期 ISO 字符串，我想将它们格式化为人类可读的日期。我正在使用angular-moment使用过滤器在我的模板中格式化这些日期的库。

<span>{{ $ctrl.date | amCalendar:referenceTime:formats }}</span>

我想将显示的日期格式自定义为以下内容:

const dateFormats = {
  relative: {
    sameDay: '[Today at] LT',
    lastWeek: 'DD MMM, YYYY [at] LT',
    sameElse: 'DD MMM, YYYY [at] LT'
  }
}

所以我可以在我的模板中执行此操作:

<span>{{ $ctrl.date | amCalendar:null:dateFormats }}</span>

但是，我希望这些 dateFormats 位于全局某个地方，而不是仅位于该组件的 Controller 内，因为我希望能够在其他模板中引用这些 dateFormats下线。

这是否符合将 dateFormats 附加到 $scope 的正确用例，或者是否有更好的方法来处理这个问题？

感谢任何帮助。提前致谢!

Answer 1

您应该创建自己的自定义过滤器。像这样的事情:

angular
  .module('myApp')
  .filter('myDateFormat', ['$filter',function ($filter) {
      const dateFormats = {
        relative: {
          sameDay: '[Today at] LT',
          lastWeek: 'DD MMM, YYYY [at] LT',
          sameElse: 'DD MMM, YYYY [at] LT'
        } 
      }
      return function() {
        return $filter('amCalendar')(null, dateFormats)
      }
  }]);

现在，您可以在模块中的任何模板中轻松使用此过滤器:

<span>{{ $ctrl.date | myDateFormat }}</span>