角度全局變量

我有一些日期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生活在全球的某個地方，而不是僅僅在這個組件的控制器內，因爲我希望能夠在其他模板中引用這些dateFormats。

這是否適用於將dateFormats添加到$scope的正確用例還是有更好的方法來處理此問題嗎？

任何幫助表示讚賞。提前致謝！

來源

2017-04-13 realph

你可以使用常量（這是一個單）做this.refer此鏈接[鏈接]（https://ilikekillnerds.com/ 2014/11 /常量值全局變量在angularjs-right-way /）] –

看看[這個答案]（http://stackoverflow.com/a/42876416/4131048），那裏無需創建自定義過濾器，您可以按照[文檔]（https://github.com/urish/angular-moment#usage） – VincenzoC

S中所述在「run」函數中自定義「amCalendar」應該查看文檔。這更好。如果您將此添加爲答案，我會接受。 – realph

您應該創建自己的自定義過濾器。事情是這樣的：

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

來源

2017-04-13 12:25:36 tanmay

是的，我認爲這種方法是最好的方式，它讓我遠離全局 - 現在，哈哈。謝謝！ – realph

@realph當然，很高興我可以幫助:) – tanmay

我的日期做的是創建一個自定義過濾器
，例如：

function ascDateFilter($filter) { 
    return function (input) { 
     return $filter('date')(input, "dd/MM HH:mm:ss"); 
    }; 
}

你可以做這樣的事情，並在您的自定義過濾器中使用的過濾器amCalendar。有了這個，你可以在同一個過濾器中將所有的代碼模板化。

來源

2017-04-13 11:57:44 Theo

沒有必要創建一個自定義過濾器，您可以在運行定製amCalendar：

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

現在，您可以輕鬆地從你的模塊中的任何模板使用此過濾器功能描述在docs中。

這裏工作示例：

angular.module('MyApp',['angularMoment']) 
 
.run(function(){ 
 
    const dateFormats = { 
 
    calendar: { 
 
     sameDay: '[Today at] LT', 
 
     lastWeek: 'DD MMM, YYYY [at] LT', 
 
     sameElse: 'DD MMM, YYYY [at] LT' 
 
    } 
 
    } 
 
    moment.updateLocale('en', dateFormats); 
 
}) 
 
.controller('AppCtrl', function($scope) { 
 
    $scope.date = new Date(); 
 
});

<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"> 
 
    <span>{{ date | amCalendar }}</span> 
 
</div>

來源

2017-04-13 13:23:16 VincenzoC

角度全局變量

回答

相關問題