2017-01-18 1 views
1

일정 로캘 설정 문제가 하나 있습니다.PrimeNG 일정 로캘

문서 (Primeng schedule docs, Full calendar locale docs)에 따르면 해당 로캘은 개체 ({locale : 'en'})로 설정할 수 있지만 영어 이외의 다른 언어는 표시하지 않습니다.

다른 언어를 설정하려면 어떻게해야합니까?

<p-schedule 
       [events]="events" 
       [locale]="???" 
       [header]="header" 
       [editable]="false" 
       [allDaySlot]="false" 
       [defaultView]="'agendaWeek'" 
       (onEventClick)="goToSelectedEvent($event)" 
       [eventRender]="eventRender" 
       [contentHeight]="800" 
     ></p-schedule> 

답변

1

"fullcalendar/dist/lang/'your language'"가 필요합니다.

그리고 그 후, 당신은 단순히 당신이 여기에서 찾을 수 있습니다

this.locale = { 
     locale: 'your language' 
}; 

사용 가능한 모든 언어를 추가 할 수 있습니다 : 나는 코멘트를 작성하기에 충분한 명성을하지 않아도 fullcalendar github 슬프게도

0

그러나 문서에 바로 거기에있다 :

Localization for different languages and formats is defined by binding the settings object to the locale property. Following is a schedule with Spanish month names.

템플릿

<p-schedule [events]="events" [locale]="es"></p-schedule> 

구성 요소

export class MyComponent { 

    es: any; 

    ngOnInit() { 
     this.es = { 
      monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 
       'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'] 
     }; 
    } 
} 

사용 가능한 옵션에 대해서는 fullcalendar 설명서를 참조하십시오. 기존 번역은 here입니다.

+0

전체 캘린더에는 일부 언어가 있으며 하드 코딩하지 않아도 잘 작동합니다. 그래서 모든 로켈 설정을 하드 코딩해야합니까? –

+0

하드 코드없이 설정할 수 있다면 궁금합니다. –

+0

이 번역물을 얻는 데 도움이되는 각도 서비스를 설치해야한다고 생각합니다. – PierreDuc

0

, 그래서 추가해야 또 다른 대답은 ... 나는 지금 당장 같은 문제에 직면 해있다. 현재는 fullcalendar 로켈 파일에서 복사 한 번역본을 하드 코딩했다. 하지만 기존 번역을 사용하는 편이 낫습니다! 구성 요소 내에서 로켈 파일을 가져 와서 사용한 방법에 대한 정보를 조금 더 제공해 주시겠습니까? 난 앵귤러 2 응용 프로그램 내에서 이러한 외부 자바 스크립트 파일을 "요구"하는 법을 정말로 모르며, 귀하의 도움에 많은 감사를드립니다! :)

편집 :가 좋아, 내가 조금 주위에 바이올린을 나를 위해 노력하고 해결책을 발견 :

내 각-CLI 설정에 로케일 파일을 추가를 ("스크립트"키 아래)와 나는 p-schedule 구성 요소에서 [locale] 입력으로 문자열을 설정하여 로켈을 사용하고 있습니다. 미세 조정을 위해 "옵션"입력을 사용하고 "eventTextColor"등과 같은 항목을 설정하므로 기본값을 사용하지 않습니다. angular2- "로

import { Component, OnInit, Input } from '@angular/core'; 
import { Options, Header, EventObject } from 'fullcalendar'; 

@Component({ 
    selector: 'your-selector', 
    templateUrl: './your.component.html', 
    styleUrls: ['./your.component.css'] 
}) 
export class YourComponent implements OnInit { 
    private locale = 'de'; 

    private options: Options = { 
    eventTextColor: '#ffffff', 
    slotLabelFormat: 'HH:mm', 
    ... 
    } 
} 
+0

webpack을 사용하여 모든 외부 라이브러리를로드하고 있습니다. 그래서저기서 언어 팩이 필요합니다. –

+0

안녕하세요, 빠른 답변을 보내 주셔서 감사합니다. 나는 angular-cli (webpack을 사용함)를 사용하고 로켈 파일에 대한 참조를 "scripts"배열에 넣습니다. 이것은 과 같이 문자열을 입력으로 설정하면 작동하지만 "하루 종일"이 제대로 번역되지 않고 변경하려고하는 것과 같은 몇 가지 결함이 여전히 있습니다. 디폴트의 ​​이벤트 칼라. 그렇다면 fullCalendar 로캘 객체를 가져 와서 로캘 문자열을 입력으로 사용하지 않고 p-schedule 구성 요소에 전달하기 전에 일부 값을 변경하는 방법이 있습니까? – Jay

+0

이벤트 옵션은 css 및 eventRender 함수를 통해 변경할 수 있습니다. 로케일은 어땠습니까? 실제로는 찾지 못했습니다. 직접 변경하는 방법은 자신의 손으로 만드는 것이 가장 좋습니다. 그러나 lib에서 언어 로케일을 변경하고 github에 변경 사항을 적용 할 수 있습니다! –

0

내가 primeng 2.0.6를 사용하고, 3.4.0 fullcalendar :

HTML :

<p-schedule [locale]="locale" [options]="options"></p-schedule> 

your.component.ts 결과는 같이 보입니다 유성 "0.7.1 라이브러리. 이것은 나를 위해 일한 것입니다 : 내가이 scheduledemo에 설정 한

  1. https://www.primefaces.org/primeng/#/schedule 당으로.HTML 파일

    난 내 index.html을의 머리 섹션에 아래의 수입을 추가 한 https://fullcalendar.io/docs/text/locale/ 당으로
    <p-schedule ... locale="fr"> 
    
  2. <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/locale/fr.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/locale/fr.js"></script> 
    

(이 프랑스어입니다) 당신이 만약 각도 cli를 사용하고 있습니다.이 파일들은 .js 파일의 "스크립트"섹션이나 index.html 대신 .angular-cli.json의 .css 파일에 추가되어야한다고 생각합니다. 이 파일에서 node_modules에있는 파일을 참조 할 수도 있습니다.

"styles": [ 
    "../node_modules/fullcalendar/dist/fullcalendar.min.css", 
    ... 
    ], 
    "scripts": [ 
    "../node_modules/moment/moment.js", 
    "../node_modules/fullcalendar/dist/fullcalendar.js", 
    ], 
: 예를 들어, (완전히 로케일 문제가 해결되지 않습니다 아래의 코드는, 그냥 .angular-cli.json에 대한 구문 예를 제공의)이 최신 primeng 소스 코드의 파일을 볼 수 있습니다

참고 1 : 단일 언어 파일을 사용하는 경우 (예 : 나의 예제와 같이) scheduleemo.html (fullcalendar 설명서 : If you are simply loading one locale, you do not need to specify the locale option)로 1 단계를 수행 할 필요조차 없습니다.

주 2 : 사용 "필요"하려고하면 언어 파일을로드하고 얻을 "catch되지 않은 형식 오류를 : e.fullCalendar.datepickerLocale는 함수가 아닙니다", 내 솔루션은이 문제를 해결합니다. (실제로 "요구"할 필요가 없음)