How to change the localization in Gantt for Angular 2
Gantt can be localized to any specific locale by setting the respective locale code like en-US, fr-FR etc., to the locale property in the Gantt. The User should refer the culture file in the app.module.ts to localize the date, time, currency, and other formats. Gantt will be displayed with the ‘en-US’ localization by default.
The culture file can be referred from the below generated node modules location.
[app.module.ts] import 'syncfusion-ej-global/i18n/ej.culture.fr-FR.min.js'; |
Gantt UI also contains the text to be displayed in the dialog popup and the toolbar which needs to be localized. To localize these texts, we need to define the localized texts in the project or by referring the pre-defined locale text files from the node modules.
The locale text file can be referred from the below generated node modules location.
[app.module.ts] import 'syncfusion-ej-global/l10n/ej.localetexts.fr-FR.min.js'; |
The localized texts can be defined in the Gantt by the following ways,
By referring the corresponding locale text file from the node modules location. [OR]
By defining the localized texts in the project.
Please refer the following code snippets for more details.
Referring the pre-defined locale text files:
[app.module.ts] import 'syncfusion-ej-global/l10n/ej.localetexts.fr-FR.min.js';
//app.component.html <ej-gantt id="GanttControl" locale= "fr-FR" //.. > </ej-gantt> |
Defining the localized texts
//app.component.html <ej-gantt id="GanttControl" locale= "fr-FR" //.. > </ej-gantt>
//app.component.ts ej.Gantt.Locale["fr-FR"] = { emptyRecord: "Aucun enregistrement à afficher", unassignedTask: "Tâche non assignée", alertTexts: { indentAlert: "Il n'y a aucune trace de Gantt est sélectionné pour effectuer le retrait", outdentAlert: "Il n'y a aucune trace de Gantt est sélectionné pour effectuer le retrait négatif", predecessorEditingValidationAlert: "Cyclique dépendance survenu, S'il vous plaît Consultez le prédécesseur", predecessorAddingValidationAlert: "Remplissez toutes les colonnes dans la table prédécesseur", idValidationAlert: "Duplicate ID", dateValidationAlert: "Invalid Date de fin", dialogResourceAlert: "Remplissez toutes les colonnes du tableau des ressources" }, columnHeaderTexts: { taskId: "ID", taskName: "Nom de la tâche", startDate: "Date de début", endDate: "Date de fin", resourceInfo: "Ressources", duration: "Durée", status: "Progrès", taskMode: "Mode tâche", predecessor: "Prédécesseurs", type: "Type", offset: "Offset", baselineStartDate: "Date de début de base", baselineEndDate: "Baseline Date de fin", WBS: "WBS", WBSPredecessor: "WBS prédécesseur", dialogCustomFieldName: "Nom de colonne", dialogCustomFieldValue: "Valeur", notes: "Remarques", taskType: "type de tâche", work: "Travail", unit: "Unité", effortDriven: "effort Driven", resourceName: "Nom de la ressource" }, editDialogTexts: { addFormTitle: "Nouvelle tâche", editFormTitle: "Modifier la tâche", saveButton: "sauvegarder", deleteButton: "Effacer", cancelButton: "Annuler", addPredecessor: "Ajouter un nouveau", removePredecessor: "Retirer", addButton: "Ajouter" }, columnDialogTexts: { field: "Champ", headerText: "En-tête", editType: "Modifier le type", filterEditType: "Modifier le type de filtre", allowFiltering: "Autoriser le filtrage", allowFilteringBlankContent: "Autoriser le filtrage du contenu Blank", allowSorting: "Autoriser tri", visible: "Visible", width: "Largeur", textAlign: "Alignement du texte", headerTextAlign: "Alignement du texte en-tête", columnsDropdownData: "Colonne Chute de données vers le bas", dropdownTableText: "Texte", dropdownTableValue: "Valeur", addData: "Ajouter", deleteData: "Retirer", allowCellSelection: "Autoriser la sélection de cellules", clipMode: "Mode Clip", tooltip: "Info-bulle", showInColumnChooser: "Afficher dans le sélecteur de colonne", headerTooltip: "Header Tooltip" }, editTypeTexts: { string: "Chaîne", numeric: "Numérique", datePicker: "Sélecteur de date", dateTimePicker: "Date Time Picker", dropdown: "Menu déroulant", boolean: "Boolean" }, textAlignTypes: { right: "Droite", left: "La gauche", center: "centre" }, clipModeTexts: { clip: "Agrafe", ellipsis: "Ellipse" }, toolboxTooltipTexts: { addTool: "Ajouter", editTool: "modifier", saveTool: "Mettre à jour", deleteTool: "Effacer", cancelTool: "Annuler", searchTool: "Chercher", indentTool: "tiret", outdentTool: "Retrait négatif", expandAllTool: "Développer tout", collapseAllTool: "Réduire tout", nextTimeSpanTool: "Suivant Timespan", prevTimeSpanTool: "Précédent Timespan", criticalPathTool: "Chemin critique", excelExportTool: "Exportation Excel", printTool: "Impression", pdfExportTool: "Exportation PDF" }, durationUnitTexts: { days: "journées", hours: "heures", minutes: "minutes", day: "journée", hour: "heure", minute: "minute" }, durationUnitEditText: { minute: ["m", "min", "minute", "minutes"], hour: ["h", "hr", "heure", "heures"], day: ["d", "dy", "journée", "journées"] }, workUnitTexts: { days: "journées", hours: "heures", minutes: "minutes" }, taskTypeTexts: { fixedWork: "travail fixe", fixedUnit: "Unités fixes", fixedDuration: "Durée fixe" }, effortDrivenTexts: { yes: "Oui", no: "Non" }, contextMenuTexts: { taskDetailsText: "Détails de la tâche ...", addNewTaskText: "Ajouter une nouvelle tâche", indentText: "tiret", outdentText: "Retrait négatif", deleteText: "Effacer", aboveText: "Au dessus de", belowText: "Au dessous de" }, newTaskTexts: { newTaskName: "Nouvelle tâche" }, columnMenuTexts: { sortAscendingText: "Trier par ordre croissant", sortDescendingText: "Trier par ordre décroissant", columnsText: "colonnes", insertColumnLeft: "Insérez la colonne de gauche", insertColumnRight: "Insérez la colonne de droite", deleteColumn: "Supprimer la colonne", renameColumn: "Renommer la colonne" }, taskModeTexts: { manual: "Manuel", auto: "Auto" }, columnDialogTitle: { insertColumn: "Insérer une colonne", deleteColumn: "Supprimer la colonne", renameColumn: "Renommer la colonne" }, deleteColumnText: "Êtes-vous sûr de vouloir supprimer cette colonne?", okButtonText: "D'accord", cancelButtonText: "Annuler", confirmDeleteText: "Confirmation de la suppression", predecessorEditingTexts: { fromText: "De", toText: "À" }, dialogTabTitleTexts: { generalTabText: "Général", predecessorsTabText: "Prédécesseurs", resourcesTabText: "Ressources", customFieldsTabText: "Les champs personnalisés", notesTabText: "Remarques" }, predecessorCollectionText: [ { id: "SS", text: "Démarrer-Démarrer", value: "Démarrer-Démarrer" }, { id: "SF", text: "Démarrer-terminer", value: "Démarrer-terminer" }, { id: "FS", text: "terminer-Démarrer", value: "terminer-Démarrer" }, { id: "FF", text: "terminer-terminer", value: "terminer-terminer" } ],
linkValidationRuleText: { taskBeforePredecessor: "Vous avez déplacé '{0}' pour commencer avant la fin de '{1}' et les deux tâches sont liées. Par conséquent, les liens ne peuvent pas être honorés. Sélectionnez une action ci-dessous pour effectuer", taskAfterPredecessor: "Vous avez déplacé '{0}' loin de '{1}' et les deux tâches sont liées. Par conséquent, les liens ne peuvent pas être honorés. Sélectionnez une action ci-dessous pour effectuer", }, linkValidationDialogTitle: "Valider l'édition", linkValidationRuleOptions: { cancel: "Annuler, Conserver le lien existant", removeLink: "Supprimez le lien et déplacez '{0}' pour commencer sur '{1}'.", preserveLink: "Déplacez le '{0}' pour commencer sur '{1}' et gardez le lien." }, connectorLineDialogText: { from: "De", to: "À", taskLink: "Lien de tâche", lag: "calorifuger", okButtonText: "D'accord", cancelButtonText: "Annuler", deleteButtonText: "Effacer", title: "Dépendance de tâche" }, nullText: "Nul" };
|
A sample to localize the Gantt control is available here.
