I'm attempting to implement a French datepicker in Angular, but I'm encountering difficulty in invoking the function within my component.
datefrench.js
!function(datefrench){datefrench.fn.datepicker.dates.fr={
days:["dimanche","lundi","mardi","mercredi","jeudi","vendredi","samedi"],
daysShort:["dim.","lun.","mar.","mer.","jeu.","ven.","sam."],
daysMin:["d","l","ma","me","j","v","s"],
months:["janvier","février","mars","avril","mai","juin","juillet","août","septembre","octobre","novembre","décembre"],
monthsShort:["janv.","févr.","mars","avril","mai","juin","juil.","août","sept.","oct.","nov.","déc."],
today:"Aujourd'hui",
monthsTitle:"Mois",
clear:"Effacer",
weekStart:1,
format:"dd/mm/yyyy"}}(jQuery);
add-date.component.ts
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, FormControl, Validators, Form } from '@angular/forms';
import { Router } from '@angular/router';
declare var datefrench;
declare var $:any;
@Component({
selector: 'app-add-date',
templateUrl: './add-date.component.html',
styleUrls: ['./add-date.component.css']
})
export class AddDateComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
$(function () {
$('#mydate').datepicker({
language: 'fr'})
});
}
}
add-date.component.html
<input type="text" id="mydate" name="mydate">
Unfortunately, an error message keeps appearing stating that the function datepicker is not being recognized.
PS: all assets (javascript/css..) are properly included