web-dev-qa-db-ja.com

AngularJS日付フィルター形式を、日付フィルターへのすべての参照で使用されるように設定しますか?

dateフィルターへの呼び出しごとにカスタム形式を定義する必要があるのではなく、('medium'以外の)デフォルト形式をグローバルに定義する方法はありますか?

コード内のすべての場所ではなく、1つのファイルに形式を設定したい(日付形式が将来変更される可能性があり、1つのファイルでの変更は、多くのファイルで変更を行う必要があるよりもはるかに優れています) )。

これは私が今やっていることです(毎回日付形式を定義しています):

{{systemTime | date:'dd MMMM @ HH:mm:ss'}}
{{modifiedTime | date:'dd MMMM @ HH:mm:ss'}}
{{getShippedTime() | date:'dd MMMM @ HH:mm:ss'}}
   etc.

ラッパーとして機能し、日付文字列をAngular myDateフィルターに渡すことになるカスタムフィルター(dateと呼びましょう)を作成することを考えていました。私のカスタムフォーマットでは、コードは次のようになります:

{{systemTime | myDate}}
{{modifiedTime | myDate}}
{{getShippedTime() | myDate}}
   etc.

ただし、myDateフィルターがAngular dateフィルターを指すようにする方法を理解できません。

ご協力いただきありがとうございます。

19
Kabb5

さらにいくつかの調査に基づいて、moderndegreeによるコメントを検討したところ、次のmyDateフィルターが機能することがわかりました。

.filter('myDate', function($filter) {    
    var angularDateFilter = $filter('date');
    return function(theDate) {
       return angularDateFilter(theDate, 'dd MMMM @ HH:mm:ss');
    }
});
40
Kabb5

これを試して

angular.module('yourmodule').filter('myDate', function($filter)
{
    return function(input)
    {
        if(input == null){ return ""; }
        var _date = $filter('date')(new Date(input), 'dd MMMM @ HH:mm:ss');
        return _date.toUpperCase();
    };
});

HTML

{{systemTime | myDate}}

Angular js。 での日付のフィルタリングとフォーマット

5
Prashobh

デコレータを使用し、

それはあなたが明示的に求めたものではありません、 デコレータ を使用してください。 angularに組み込まれており、servicesdirectivesfiltersなどにパッチを適用するように設計されています...

あなたのケースでは、日付フィルターが提供されていない場合は、カスタム日付形式を使用する必要があります。

app.config(function ($provide) {
    $provide.decorator('dateFilter', function ($delegate) {
        return function () {

            // Check if the date format argument is not provided
            if (!arguments[1]) { 
                arguments[1] = 'dd MMMM @ HH:mm:ss';
            }

            var value = $delegate.apply(null, arguments);
            return value;
        };
    })
});
4
Jossef Harush

formatは、何も指定されていない場合、デフォルトでmediumDateになります。デフォルトで他の何かにするために組み込まれているものはありません。

https://github.com/angular/angular.js/blob/master/src/ng/filter/filters.js#L382

2
Hector Virgen

.aspxページで作業していて、日付形式が構成ファイルに保存されている場合...

  1. Angularページを挿入する.aspxから、web.config日付形式でグローバル変数を設定します

    var _settingsDateFormat = '<%= appSettings.DateFormat%>';

  2. アプリで使用するグローバルフィルターを設定する

yourModule.filter('myDateFormat', function ($filter) {
        return function (input) {
            if (input == null) { return ""; }
            var formattedDate = $filter('date')(new Date(input), _settingsDateFormat);
            return formattedDate;
        };
});
  1. 日付にカスタムフィルターを追加するだけです

       Effective {{row.StartDate|myDateFormat}} - {{row.StopDate|myDateFormat}}
    
0