Développement langages:angular

Afficher une date en FR dans Angular

Anonymous (anonymous@undisclosed.example.com) — 2021-05-17T16:05:29+00:00

Afficher une date en FR dans Angular À partir d’une date au format UTC : TS: import localeFr from '@angular/common/locales/fr'; import { registerLocaleData } from '@angular/common'; registerLocaleData(localeFr, 'fr'); HTML: {{maDate | date : 'EEEEEE dd/MM/yyyy':'UTC+2':'fr'}}

Async et Await

Anonymous (anonymous@undisclosed.example.com) — 2020-11-24T12:00:43+00:00

Async et Await async maFonction(){ try { const sourceCommandes = await http.get('assets/fichier.txt', { responseType: 'text' }).toPromise(); } catch (error) { console.error("Le fichier n’a pas pu être récupéré"); } }

Changer le titre de la page

Anonymous (anonymous@undisclosed.example.com) — 2020-11-21T10:00:44+00:00

Changer le titre de la page export class AppComponent { public constructor(private titleService: Title ) { } public setTitle( newTitle: string) { this.titleService.setTitle( newTitle ); } }

Changer l’URL dans le navigateur et l’historique

Anonymous (anonymous@undisclosed.example.com) — 2020-11-21T10:25:40+00:00

Changer l’URL dans le navigateur et l’historique (On ne change pas de page, on change juste l’url de la page active) import {Location} from '@angular/common'; … public constructor(private location: Location ) { } … this.location.replaceState("/segment1/segment2");

Récupérer une date vers Angular depuis un JSON (service C#)

Anonymous (anonymous@undisclosed.example.com) — 2021-08-27T11:35:17+00:00

Récupérer une date vers Angular depuis un JSON (service C#) Si on récupère une date depuis un JSON, elle n'est pas convertie automatiquement en un objet date. Pour cela il faut faire la manipulation suivante : maDate = (maDate ? new Date(maDate) : null);

Éléments distincts dans un tableau

Anonymous (anonymous@undisclosed.example.com) — 2020-06-30T08:09:41+00:00

Éléments distincts dans un tableau source: Tableau de nombres const elementsDistincts = tableau.filter((x, i) => tableau.indexOf(x) === i); Tableau d’objets const elementsDistincts = tableau.filter((x, i, tab) => tab.findIndex(y => y.id === x.id) === i);

Erreurs avec NPM Install

Anonymous (anonymous@undisclosed.example.com) — 2019-10-07T11:49:21+00:00

Erreurs avec NPM Install Une solution qui fonctionne est de supprimer le fichier node_modules (le déplacer et/ou le renommer permet de ne pas avoir à attendre sa très longue suppression) dans le répertoire du projet. Ensuite redémarrer l’ordinateur et exécuter

Importer un fichier json depuis les assets

Anonymous (anonymous@undisclosed.example.com) — 2020-03-22T14:04:34+00:00

Importer un fichier json depuis les assets Source: Dans tsconfig.json il faut activer ces 2 options de compilation : … "compilerOptions": { … "resolveJsonModule": true, "esModuleInterop": true … } Dans le composant qui a besoin de json, il faut l’importer :

Importer un fichier texte (txt) depuis les assets

Anonymous (anonymous@undisclosed.example.com) — 2020-03-22T14:27:00+00:00

Importer un fichier texte (txt) depuis les assets source:  import { HttpClient } from '@angular/common/http'; … constructor( private http: HttpClient ) {} … this.http.get('assets/test.txt', {responseType: 'text'}) .subscribe(data => console.log(data));

Routing : Lazy loading

Anonymous (anonymous@undisclosed.example.com) — 2019-02-27T11:01:54+00:00

Routing : Lazy loading

Sauver des paramèttres dans le LocalStorage ou le SessionStorage

Anonymous (anonymous@undisclosed.example.com) — 2020-07-09T14:07:06+00:00

Sauver des paramèttres dans le LocalStorage ou le SessionStorage Cette fonctionnalité permet de sauvegarder des élémentst dans le navigateur de l’utilisateur. Sauvegarder un élément localStorage.setItem('EditeurNbLignesCodes', this.nbLignesCode.toString());

ng-select (sélection multiples avec recherche)

Anonymous (anonymous@undisclosed.example.com) — 2019-01-29T10:39:29+00:00

ng-select (sélection multiples avec recherche) Démo :

Savoir quel imports prennent de la place dans l’application

Anonymous (anonymous@undisclosed.example.com) — 2020-09-09T12:28:59+00:00

Savoir quel imports prennent de la place dans l’application Schéma utilisation espace disque: npm install -g webpack-bundle-analyzer (1ère fois uniquement) ng build app1 --stats-json webpack-bundle-analyzer C:\GIT\app1\dist\app1\stats.json

Prendre en compte les retours à la ligne (sans balises HTML )

Anonymous (anonymous@undisclosed.example.com) — 2019-09-26T08:42:17+00:00

Prendre en compte les retours à la ligne (sans balises HTML
)

Sauver une date Angular (TS) vers Service web (C#) via un JSON

Anonymous (anonymous@undisclosed.example.com) — 2021-08-27T11:33:54+00:00

Sauver une date Angular (TS) vers Service web (C#) via un JSON Lors de la conversion en JSON, la date est décalée en fonction de l'heure locale puis sauvée comme si elle était UTC ce qui pose en souci lors de la récupération de la date. Voici la manipulation à effectuer pour mettre la date en UTC avant l'envoi en JSON au service web afin d'éviter les décalages d'heure :

Angular (TypeScript)

Anonymous (anonymous@undisclosed.example.com) — 2019-01-26T16:13:12+00:00

Angular (TypeScript) * Outils et librairies * Afficher une date en FR dans Angular * Async et Await * Changer le titre de la page * Changer l’URL dans le navigateur et l’historique * Erreurs avec NPM Install * Importer un fichier json depuis les assets * Importer un fichier texte (txt) depuis les assets * ng-select (sélection multiples avec recherche) * Prendre en compte les retours à la ligne (sans balises HTML
) * Routing : Lazy loading * Récupérer une date vers Angular depu…

Tri d’une liste d’éléments

Anonymous (anonymous@undisclosed.example.com) — 2021-06-07T15:41:16+00:00

Tri d’une liste d’éléments Comparer des chaînes de caractères .sort((a, b) => { // même parent => trier sur le nom de l’élément if (a.parentID === b.parentID) { return (a.nom.localeCompare(b.nom)); // trier sur le nom du parent } else { return (a.nomParent.localeCompare(b.nomParent)); } }); .sort((a, b) => a.nom.localeCompare(b.nom));

Vérifier si une URL contient un segment en particulier

Anonymous (anonymous@undisclosed.example.com) — 2020-11-21T10:04:54+00:00

Vérifier si une URL contient un segment en particulier public constructor(private router: Router ) { } … if (this.router.url.includes('/test/sort')) { // faire quelque chose }