如何将 primeNg 日历 "locale" 用于多个值或动态使用并自动更改 firstdate?
how to use primeNg calendar "locale" for more than one value or dynamically and also change firstdate automaticaly?
基于它,例如,如果语言环境是法国,则工作日是从星期一到星期日,如果德语是从星期六到星期日
我如何在 locale
中使用多个
<p-calendar [(ngModel)]="value" [locale]="fr\de/?/??what i write here"></p-calendar>
//在 ts 文件上
this.de = {
firstDayOfWeek: 1,
dayNames: [, "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday","Sunday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
this.fr = {
firstDayOfWeek: 0,
dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
在组件 .ts 文件中
@Component({
selector: 'app-calendar-demos',
templateUrl: './calendar-demos.component.html',
styleUrls: ['./calendar-demos.component.scss']
})
export class CalendarDemosComponent implements OnInit {
value: Date;
fday:number;
_localeCal: any;
x=Intl.DateTimeFormat().resolvedOptions().timeZone;
constructor() {
if(this.x=='Asia/Calcutta'){
this.fday=1;
}
else if(this.x==' Europe/Paris'||'USA'||'Canada/Pacific'){
this.fday=0;
}
}
ngOnInit(): void {
var offset = new Date().getTimezoneOffset();
console.log(offset);
console.log(Intl.DateTimeFormat().resolvedOptions().timeZone);
this._localeCal = {
firstDayOfWeek:this.fday,
dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
}
}
这里我们简单地通过使用 getTimezoneOffset() js fun.store 变量来检查时区,并通过检查构造函数上的条件以自动撤销来传递到第一周的一天..控制台以查看结果。您可以根据需要修改 else if 条件。
在 componen.html
<p-calendar [(ngModel)]="value" [locale]="_localeCal"></p-calendar>
calendar for utc region {{x}}
如果您知道其他方式,请随时回复。
谢谢
基于它,例如,如果语言环境是法国,则工作日是从星期一到星期日,如果德语是从星期六到星期日 我如何在 locale
中使用多个<p-calendar [(ngModel)]="value" [locale]="fr\de/?/??what i write here"></p-calendar>
//在 ts 文件上
this.de = {
firstDayOfWeek: 1,
dayNames: [, "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday","Sunday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
this.fr = {
firstDayOfWeek: 0,
dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
在组件 .ts 文件中
@Component({
selector: 'app-calendar-demos',
templateUrl: './calendar-demos.component.html',
styleUrls: ['./calendar-demos.component.scss']
})
export class CalendarDemosComponent implements OnInit {
value: Date;
fday:number;
_localeCal: any;
x=Intl.DateTimeFormat().resolvedOptions().timeZone;
constructor() {
if(this.x=='Asia/Calcutta'){
this.fday=1;
}
else if(this.x==' Europe/Paris'||'USA'||'Canada/Pacific'){
this.fday=0;
}
}
ngOnInit(): void {
var offset = new Date().getTimezoneOffset();
console.log(offset);
console.log(Intl.DateTimeFormat().resolvedOptions().timeZone);
this._localeCal = {
firstDayOfWeek:this.fday,
dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
dayNamesShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin: ["Su","Mo","Tu","We","Th","Fr","Sa"],
monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
today: 'Today',
clear: 'Clear',
dateFormat: 'mm/dd/yy',
weekHeader: 'Wk'
};
}
}
这里我们简单地通过使用 getTimezoneOffset() js fun.store 变量来检查时区,并通过检查构造函数上的条件以自动撤销来传递到第一周的一天..控制台以查看结果。您可以根据需要修改 else if 条件。
在 componen.html
<p-calendar [(ngModel)]="value" [locale]="_localeCal"></p-calendar>
calendar for utc region {{x}}
如果您知道其他方式,请随时回复。
谢谢