web-dev-qa-db-fra.com

Comment puis-je échapper à des personnages dans un Angular pipe de date?

J'ai une variable Angular date today que j'utilise le date pipe on, comme ceci:

{{today | date:'LLLL d'}}

13 février

Cependant, je voudrais le faire apparaître comme ceci:

13 jours en février

Lorsque j'essaie une approche naïve à ce sujet, j'obtiens le résultat suivant:

{{today | date:'d days so far in LLLL'}}

13 13PM201818 18o fPMr in February

En effet, par exemple, d fait référence au jour.

Comment puis-je échapper à ces caractères dans un pipe Angular date? J'ai essayé \d et autres, mais le résultat n'a pas changé avec les barres obliques inverses ajoutées.

angulardatedate-pipe
9
Thunderforge

Que dis-tu de ça:

{{today | date:'d \'days so far in\' LLLL'}}

Tout ce qui est entre guillemets simples est ignoré. N'oubliez pas de leur échapper.

13
Daniel P

Ensuite, comme l’a suggéré RichMcCluskey, la seule solution alternative pour enchaîner plusieurs canaux consiste à créer un canal personnalisé qui appelle au format momentjs avec la date passée. Vous pouvez ensuite utiliser la même syntaxe, y compris la séquence d'échappement, que momentjs prend en charge.

Quelque chose comme cela pourrait fonctionner, ce n'est pas une solution exhaustive en ce sens qu'elle ne traite pas du tout de la localisation et qu'il n'y a pas de code ou de test de gestion des erreurs.

import { Inject, Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'momentDate', pure: true })
export class MomentDatePipe implements PipeTransform {

    transform(value: any, pattern: string): string {
        if (!value)
            return '';
        return moment(value).format(pattern);
    }
}

Et puis le code d'appel:

{{today | momentDate:'d [days so far in] LLLL'}}

Pour tous les spécificateurs de format, voir la documentation pour le format . 

N'oubliez pas que vous devez importer momentjs sous la forme d'une instruction d'importation, l'importer dans votre fichier de configuration cli ou référencer la bibliothèque à partir de la page HTML racine (comme index.html).

1
Igor

Autant que je sache, cela n’est pas possible avec le tube de date Angular au moment de cette réponse. Une alternative consiste à utiliser plusieurs canaux de date comme ceci:

{{today | date:'d'}} days so far in {{today | date:'LLLL'}}

MODIFIER:

Après avoir posté ceci, j’ai essayé la solution de @ Gh0sT et elle a fonctionné. Je suppose donc qu’il existe un moyen d’utiliser un canal de dates.

1
Rich McCluskey

Cela fonctionne pour moi {{aujourd'hui | date: "d 'jours jusqu'à présent dans' LLLL"}}

0
Carlos Fagiani Jr