Question

我需要在有角度的版本7中更改日历的语言。我没有找到太多有关此问题的文档。最主要的是更改日历上显示的日期的语言。

！-开始代码段：js隐藏：虚假控制台：真babel：假->

import { Component, OnInit, ViewChild } from '@angular/core';
import { CalendarComponent } from 'ng-fullcalendar';
import { Options } from 'fullcalendar';

@Component({
  selector: 'app-calendario',
  templateUrl: './calendario.component.html',
  styleUrls: ['./calendario.component.css']
})
export class CalendarioComponent implements OnInit {
  //calendario
  calendarOptions: Options;
  displayEvent: any;
  @ViewChild(CalendarComponent) ucCalendar: CalendarComponent;

  constructor() { }

  ngOnInit() {

    this.calendarOptions = {
      editable: true,
      eventLimit: false,
      header: {
        left: '',
        center: 'title',
        right: 'month'
      },

      events: []
    };
  }      

}

我尝试在calendarOptions中添加属性locale ='es'，但是它不起作用，将此添加到我的有角json中，但我不知道如何实现

     "scripts": [
              "node_modules/fullcalendar/dist/locale/es.js"
            ]

Answer 1

您可以使用FullCalendarComponent设置区域设置代码来完成此操作。

@ViewChild('calendar') calendarComponent: FullCalendarComponent;

并在ngOnInit中，如下所示：

this.calendarComponent.locales = [ { code: 'pt-br' } ];

我希望对您有用。

Answer 2

感谢Gabriel我使这种方法有效

首先请确保您已导入想要的语言

import esLocale from '@fullcalendar/core/locales/es';
import frLocale from '@fullcalendar/core/locales/fr';

在html文件的全日历选择器中，应将值分配给语言环境和语言环境选项。

    <full-calendar
    defaultView="dayGridMonth"
    [locales]="locales"
    locale="es"
    [weekends]="false"
    [plugins]="calendarPlugins"></full-calendar>

然后是一个变量，其中包含您需要的所有语言

locales = [esLocale, frLocale];

Answer 3

我建议一个简单的解决方案“在这种情况下，我想将语言更改为法语”

以您的名字。component.ts

从'@ fullcalendar / core / locales / fr'导入frLocale；

calendarOptions：CalendarOptions = { locale：frLocale，//根据导入包事件：[ {title：'event 1'，date：'2020-04-01'}， {title：'event 2'，date：'2020-07-15'} ] };
以您的名字。component.html

<完整日历[options] =“ calendarOptions” id ='fullcalendar'>

如何在角度7的全日历中使用语言环境

3 个答案: