App 생성자와 같은 한 곳에서 모든 인스턴스에 대한 기본 MdDatePicker 옵션 (평일, 월간 번역 ...)을 설정하는 방법은 무엇입니까?

Question

TypeScript (tsc 2.1.4), JSPM 및 aurelia- materialize-bridge@0.20.6을 사용하는 Aurelia 프로젝트.

프로젝트가 다국어 (번역본이 데이터베이스에 있고 필요에 따라 "LanguageService"를 통해 주입 됨)이므로 번역 된 인스턴스 MdDatePicker도 필요합니다.

나는오늘 처럼 monthsFull, monthsShort을, 속성을 변환하는 방법을 ... MdDatePicker 인스턴스 (pickadate.js 선택기의 속성 실제로) 당 뷰/뷰 - 모델에서이 방법에 방법을 발견 :

import * as bridge from 'aurelia-materialize-bridge'; 

constructor(){ 
    bridge.MdDatePicker.prototype;//Can't find where to put translations 
} 

하지만 난 찾을 수 없습니다 :

<input md-datepicker="container: body;value.two-way: fromDate;" 
      md-datepicker.ref="dpickerFrom" 
      type="date" placeholder=${dtPickTitle} /> 

    attached(
     var picker = (<any>this).dpickerFrom.picker;  
     var settings = picker.component.settings; 

     settings.monthsFull = this.languageService.datePickerTran.monthsFull; // e.g. [ 'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember' ] 
     settings.today = this.languageService.datePickerTran.today; //e.g."Heute" 
     picker.render(true); 
    ) 

나는 App.ts 세계적으로 필요한 속성에 도달하기 위해 노력했다 필요합니다.

이 올바른 접근 방식입니까? 주어진 플랫폼을 고려할 때 모든 인스턴스에 대해 한 곳에서이 속성 (기본값)을 설정할 수있는 방법이 있습니까?

Answer 1

나는 내 대답을 여기에 게시하도록 OP에게 말했습니다. 그 목적은 여기에 병합 https://github.com/aurelia-ui-toolkits/aurelia-materialize-bridge/blob/master/src/datepicker/datepicker.js#L19

: https://github.com/aurelia-ui-toolkits/aurelia-materialize-bridge/blob/master/src/datepicker/datepicker.js#L64

그리고 결과는 여기에 날짜 선택기를 초기화하는 데 사용됩니다 https://github.com/aurelia-ui-toolkits/aurelia-materialize-bridge/blob/master/src/datepicker/datepicker.js#L76

을 그래서 여기가

가 여기에 options 바인딩 있습니다 .. :-) 간다 그래서 https://github.com/aurelia-ui-toolkits/aurelia-materialize-bridge/blob/master/src/datepicker/datepicker.js#L47-L60

: 당신이 링크를 방문 할

지금, 당신은 여기 국제화 설정의 주석 처리 예 (독일어 문자열)을 볼 수도 있습니다 당신이 options 바인딩의 국제화 속성을 설정하면, 그것은 일할 수있는 ...

<input 
    md-datepicker="container: body; value.two-way: selectedDate; options.bind:i18nOptions;" 
    type="date" placeholder="pick a date"/> 

이 i18nOptions가있을 경우 :

{ 
    selectMonths: true, // Creates a dropdown to control month 
    selectYears: 15, // Creates a dropdown of 15 years to control year 
    monthsFull: [ 'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember' ], 
    monthsShort: [ 'Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez' ], 
    weekdaysFull: [ 'Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag' ], 
    weekdaysShort: [ 'So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa' ], 
    today: 'Heute', 
    clear: 'Löschen', 
    close: 'Schließen', 
    firstDay: 1, 
    format: 'dddd, dd. mmmm yyyy', 
    formatSubmit: 'yyyy/mm/dd' 
} 

는 확실히 더 명시 적으로 만들고 싶어.