[]
事前定義された範囲が選択されている場合でも、 カレンダーをドロップダウンに表示したままにするかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はfalseです。
これにより、事前定義された範囲が選択された場合、コントロールはカレンダーを非表示にします。
この特定のコンポーネントのグローバルなWjOptions.asyncBindingsの設定をオーバーライドできます。 詳細については、WjOptions. WjOptions.asyncBindings プロパティの説明を参照してください。
コントロールがクリックされたときに、選択範囲を自動的に 単語/数字全体に拡張するかどうかを示す値を取得または設定します。
このプロパティのデフォルト値はtrueです。
ドロップダウンボックスに表示されるCalendar コントロールへの参照を取得します。
ユーザーがコントロールの入力要素をクリックしたときに実行する操作を決定する値を取得または設定します。
ほとんどのドロップダウンコントロールに対して、このプロパティはデフォルトで ClickAction.Select に設定されます。これにより、ユーザーはマウスでテキストの一部を選択できます。
編集不可のテキストを表示するドロップダウンコントロール(MultiSelectなど)の場合、このプロパティはデフォルトでClickAction.Toggleに設定されます。
ユーザーが選択操作を行ったときにドロップダウンを自動的に閉じるかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はtrueです。
isDroppedDown プロパティがtrueに設定されているときに表示されるドロップダウン要素を取得します。
コントロールのドロップダウン要素に追加するCSSクラス名を取得または設定します。
このプロパティは、ドロップダウン要素をスタイル設定する場合に便利です。 ドロップダウン要素は、 コントロール自体の子としてではなく、ドキュメントボディの子として表示され、 親コントロールに基づいてCSSセレクタを使用することができないためです。
選択された日付の表示に使用される書式を取得または設定します。
選択された日付の表示に使用される書式を取得または設定します。
書式文字列は、.NET形式の 日付書式文字列として表されます。 このプロパティのデフォルト値は 'd'で、カルチャに依存する短い日付形式 (例:米国では6/15/2020、フランスでは15/6/2020、 日本では2020/6/15)を表します。
プログラムによるアクセスに使用されるWijmo gotFocusイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のgotFocus Wijmoイベント名を使用してください。
ユーザーがマウスホイールで現在の値を編集できるかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はtrueです。
このプロパティをfalseに設定すると、コントロールのドロップダウンcalendarのカスタムのホイール操作も無効になります。
コントロールをホストしているDOM要素を取得します。
このイベントは、コンポーネントがAngularによって初期化された後、つまり すべての連結プロパティが割り当てられ、子コンポーネント(ある場合)が初期化された後にトリガされます。
コントロールによってホストされているHTML入力要素を取得します。
このプロパティは、入力要素の属性をカスタマイズする場合に使用します。
たとえば、以下のコードはinputElementプロパティを使用して、コントロールの入力要素にaria-label属性を追加することでアクセシビリティを向上させます。
// InputDateコントロールを作成し、アクセシビリティを向上させるためにaria-labelを追加します
let inputDate = new InputDate('#theInputDate');
inputDate.inputElement.setAttribute('aria-label', 'enter trip start date in the format month/day/year')
コントロールによってホストされているHTML入力要素の"type"属性を取得または設定します。
デフォルトのままでは現在のカルチャ、デバイス、またはアプリケーションに関してうまく機能しない場合は、 このプロパティを使用してデフォルト設定を変更します。 その場合、値を「number」または「text」に変更してみてください。
「number」タイプのような入力要素はChromeで選択を防ぐため、推奨されません。詳細については、「https://stackoverflow.com/questions/21177489/selectionstart-selectionend-on-input-type-number-no-longer-allowed-in-chrome」を参照してください。
プログラムによるアクセスに使用されるWijmo invalidInputイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のinvalidInput Wijmoイベント名を使用してください。
ドロップダウンを表示するときにコントロールがフェードインアニメーションを使用するかどうかを示す値を取得または設定します。
このプロパティのデフォルト値はfalseです。
コントロールが無効かどうかを判定する値を取得または設定します。
無効化されたコントロールは、マウスイベントやキーボードイベントを取得できません。
ドロップダウンが現在表示されているかどうかを示す値を取得または設定します。
このプロパティのデフォルト値はfalseです。
プログラムによるアクセスに使用されるWijmo isDroppedDownChangedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のisDroppedDownChanged Wijmoイベント名を使用してください。
プログラムによるアクセスに使用されるWijmo isDroppedDownChangingイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のisDroppedDownChanging Wijmoイベント名を使用してください。
コンポーネントがAngularによって初期化されているかどうかを示します。 この値は、initializedイベントをトリガする直前にfalseからtrueになります。
ユーザーがマウスとキーボードを使用してコントロール値を変更できるかどうかを示す値を取得または設定します。
このプロパティのデフォルト値はfalseです。
コントロール値をnull以外の値に設定する必要があるか、 それとも(コントロールのコンテンツを削除することで)nullに設定できるかを 決定する値を取得または設定します。
このプロパティは、ComboBox、InputDate、InputTime、InputDateTime、 およびInputColor などのほとんどのコントロールに対してデフォルトでtrueに設定されます。 AutoComplete コントロールに対してデフォルトでfalseに設定されます。
現在、コントロールがタッチイベントを処理しているかどうかを示す値を取得します。
コントロールが現在更新中かどうかを示す値を取得します。
ドロップダウンカレンダーの日付をカスタマイズするフォーマッター関数を取得または設定します。
このフォーマッター関数は、任意の日付に任意の内容を追加できます。そのため、カレンダーの外観と動作を全面的にカスタマイズすることが可能です。
この関数は以下の2つのパラメーターをとります。
以下のサンプルコードは週末を無効な状態で表示します。
inputDate.itemFormatter = (date, element) => {
const day = date.getDay();
element.style.backgroundColor = day == 0 || day == 6 ? 'yellow' : '';
}
日付が選択可能かどうかを決定するバリデーター関数を取得または設定します。
指定された場合、このバリデーター関数は、調べる日付を表す1つのパラメーターを受け取り、その日付が無効で選択できない場合、falseを返す必要があります。
以下のサンプルコードは、週末の日付を選択できないようにします。
inputDate.itemValidator = date => {
const weekday = date.getDay();
return weekday != 0 && weekday != 6;
}
プログラムによるアクセスに使用されるWijmo lostFocusイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のlostFocus Wijmoイベント名を使用してください。
編集中に使用するマスクを取得または設定します。
マスクの書式は、wijmo.input.InputMask コントロールで使用される書式と同じです。
指定する場合、このマスクは format プロパティおよびseparatorプロパティの値と互換性がある必要があります。 たとえば、「MM/dd/yyyy」と書式設定された日付範囲の入力に、「-」区切り文字でマスク「99/99/9999 - 99/99/9999」を使用できます。
ユーザーが入力できる最も遅い日付を取得または設定します。
このプロパティのデフォルト値は nullです。これは、最も早い日付が定義されていないことを意味します。
min およびmax プロパティの使用方法については、 「minおよびmaxプロパティの使用<」トピックを参照してください。
ユーザーが入力できる最も早い日付を取得または設定します。
このプロパティのデフォルト値は nullです。これは、最も早い日付が定義されていないことを意味します。
min およびmax プロパティの使用方法については、 「minおよびmaxプロパティの使用<」トピックを参照してください。
ドロップダウンカレンダーに表示する月数を取得または設定します。
このプロパティのデフォルト値は2です。
このプロパティの詳細については、Calendar.monthCountプロパティを参照してください。
同じカレンダーに複数の月を表示する場合、月は折り返し可能なflex-boxコンテナを使用して表示されます。 CSSを使用して、ドロップダウンの行ごとに表示される月数を制限できます。
たとえば、次のサンプルコードドは、行ごとに3か月を表示するドロップダウンを使用してInputDateコントロールを作成します。
import { InputDate } from '@grapecity/wijmo.input';
let idt = new InputDate(document.createElement('#theInputDate'), {
monthCount: 6,
dropDownCssClass: 'three-months-per-row'
});
.three-months-per-row .wj-calendar-multimonth {
width: calc(3 * 21em);
}
コントロールが空のときにヒントとして表示される文字列を取得または設定します。
事前定義された範囲を定義するオブジェクトを取得または設定します。
このプロパティは、selectionModeプロパティがDateSelectionMode.Rangeに設定されている場合にのみ役に立ちます。
オブジェクト内の各プロパティは、事前定義された範囲を表し、プロパティ名で識別され、2つの日付(範囲の開始と終了)を持つ配列で定義されます。
null値のプロパティは、カレンダーをクリックして定義するカスタム範囲を表します。
以下に例を示します。
import { DateTime } from '@grapecity/wijmo';
import { InputDate } from '@grapecity/wijmo.input';
new InputDate(host, {
selectionMode: 'Range',
predefinedRanges: getRanges()
});
function getRanges() {
let dt = DateTime,
now = new Date();
return {
'今週': [dt.weekFirst(now), dt.weekLast(now)],
'先週': [dt.weekFirst(dt.addDays(now, -7)), dt.weekLast(dt.addDays(now, -7))],
'来週': [dt.weekFirst(dt.addDays(now, +7)), dt.weekLast(dt.addDays(now, +7))],
'今月': [dt.monthFirst(now), dt.monthLast(now)],
'先月': [dt.monthFirst(dt.addMonths(now, -1)), dt.monthLast(dt.addMonths(now, -1))],
'来月': [dt.monthFirst(dt.addMonths(now, +1)), dt.monthLast(dt.addMonths(now, +1))],
'カスタムの範囲': null
};
}
プログラムによるアクセスに使用されるWijmo rangeChangedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のrangeChanged Wijmoイベント名を使用してください。
範囲選択で最後に選択された日付を取得または設定します。
日付範囲の選択を有効にするには、selectionModeプロパティをDateSelectionMode.Rangeに設定します。
プログラムによるアクセスに使用されるWijmo rangeEndChangedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のrangeEndChanged Wijmoイベント名を使用してください。
日付範囲の編集時に許可される最大長を取得または設定します。
このプロパティは、selectionModeプロパティがDateSelectionMode.Rangeに設定されている場合にのみ使用されます。
このプロパティのデフォルト値は0です。これは、範囲の長さの最大値がないことを意味します。
日付範囲の編集時に許可される最小日数を取得または設定します。
このプロパティは、selectionModeプロパティがDateSelectionMode.Rangeに設定されている場合にのみ使用されます。
このプロパティのデフォルト値は0です。これは、範囲の長さの最小値がないことを意味します。
プログラムによるアクセスに使用されるWijmo refreshedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のrefreshed Wijmoイベント名を使用してください。
プログラムによるアクセスに使用されるWijmo refreshingイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のrefreshing Wijmoイベント名を使用してください。
カレンダーボタンがリピートボタン(押された状態で繰り返し実行するボタン)として動作するかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はtrueです。
要素内のコントロールを右から左のレイアウトでホストするかどうかを示す値を取得します。
このプロパティは、selectionModeプロパティがDateSelectionMode.Rangeに設定されている場合にのみ使用されます。
このプロパティのデフォルト値は「 - 」です。
コントロールにドロップダウンボタンを表示するかどうかを示す値を取得または設定します。
このプロパティのデフォルト値はtrueです。
カレンダーに現在の月とナビゲーションボタンのある領域を表示するかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はtrueです。
ユーザーが月カレンダーのヘッダー要素をクリックすると、カレンダーに 月のリストを表示するかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はShowMonthPicker.Firstです。
ユーザーが年カレンダーのヘッダー要素をクリックすると、ドロップダウンカレンダーに 年のリストを表示するかどうかを決定する値を取得または設定します。
このプロパティのデフォルト値はtrueです。
コントロールに表示されるテキストを取得または設定します。
プログラムによるアクセスに使用されるWijmo textChangedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のtextChanged Wijmoイベント名を使用してください。
現在選択されている日付を取得または設定します。
このプロパティのデフォルト値は現在の日付です。
プログラムによるアクセスに使用されるWijmo valueChangedイベントのAngular(EventEmitter)バージョン。 コードでこのイベントのAngularバージョンをサブスクライブする場合は、このイベント名を使用してください。 テンプレート連結では、通常のvalueChanged Wijmoイベント名を使用してください。
カレンダーに現在の月の後に表示する週数を取得または設定します。
このプロパティのデフォルト値はzeroです。
カレンダーに現在の月の前に表示する週数を取得または設定します。
このプロパティのデフォルト値はzeroです。
[(ngModel)]ディレクティブ(指定されている場合)によって表されるプロパティの名前を定義します。 デフォルト値は'value'です。
DropDown コントロールのインスタンス化に使用されるテンプレートを取得または設定します。
コントロールの新しいインスタンスにテンプレートを適用し、ルート要素を返します。
このメソッドはテンプレート化されたコントロールのコンストラクターによって呼び出され、 テンプレートのパーツを対応するコントロールメンバにバインドする役割を持ちます。
以下のサンプルコードは、InputNumber コントロールのインスタンスにテンプレートを適用します。 このテンプレートには、'wj-part'属性が'input'、'btn-inc'、および'btn-dec'に設定された要素を含める必要があります。 コントロールのメンバである'_tbx'、'_btnUp'、'_btnDn'には、これらの要素への参照が割り当てられます。
this.applyTemplate('wj-control wj-inputnumber', templateString, {
_tbx: 'input',
_btnUp: 'btn-inc',
_btnDn: 'btn-dec'
}, 'input');
@param classNames コントロールのホスト要素に追加するクラスの名前。 @param template コントロールのテンプレートを定義するHTML文字列。 @param parts パーツ変数とその名前のディクショナリー。 @param namePart ホスト要素にちなんで名付けられたパーツの名前。 これにより、コントロールがフォームで使用されたときにデータをどのように送信するかが決まります。
次にendUpdate が呼び出されるまで通知を中断します。
Wijmoコンポーネントから継承されるカスタムコンポーネントを作成する場合は、このメソッドを
オーバーライドして、通常はクラスコンストラクタで行う必要な初期化を行うことができます。
このメソッドは、Wijmoコンポーネントコンストラクタの最後の行で呼び出され、
カスタムコンポーネントのコンストラクタを宣言しなくて済むようにします。これにより、
コンストラクタのパラメータを保持したり、Wijmoコンポーネントのコンストラクタパラメータとの同期を維持する必要がなくなります。
beginUpdate/endUpdate ブロック内で関数を実行します。
この関数の実行が完了するまでコントロールは更新されません。 このメソッドは、関数が例外を生成した場合でも endUpdate が呼び出されるようにします。
実行する関数。
beginUpdate の呼び出しによって中断された通知を再開します。
このコントロールにフォーカスを設定します。
オブジェクトが指定されたプロパティを持つかどうかを判定します。
プロパティの名前。
指定したオブジェクトからプロパティをコピーしてコントロールを初期化します。
このメソッドを使用すると、各プロパティの値をコードで設定する代わりにプレーンなデータオブジェクトを使用してコントロールを初期化できます。
例:
grid.initialize({
itemsSource: myList,
autoGenerateColumns: false,
columns: [
{ binding: 'id', header: 'Code', width: 130 },
{ binding: 'name', header: 'Name', width: 60 }
]
});
// 以下と同等です。
grid.itemsSource = myList;
grid.autoGenerateColumns = false;
// など
初期化データは適用時に型チェックされます。 初期化オブジェクトに不明なプロパティ名または無効なデータ型が含まれている場合、このメソッドは例外を発生します。
初期化データを含むオブジェクト。
非同期更新を発生させるため、コントロールを無効にします。
内容だけでなくコントロールのレイアウトも更新するかどうか。
オブジェクトが別のオブジェクトのプロトタイプチェーンに存在するかどうかを判定します。
プロトタイプチェーンが判定される別のオブジェクト。
invalidInput イベントを発生させます。
イベントハンドラーがイベントをキャンセルした場合、コントロールは無効な入力内容とフォーカスを保持します。
rangeChanged イベントを発生させます。
rangeEndChanged イベントを発生させます。
refreshing イベントを発生させます。
textChanged イベントを発生させます。
valueChanged イベントを発生させます。
指定されたプロパティが列挙可能かどうかを判断します。
プロパティの名前。
このControl が所有する要素にアタッチされている1つまたは複数のイベントリスナーを解除します。
イベントのターゲット要素。 nullの場合、すべてのターゲットにアタッチされているリスナーが解除されます
イベントを指定する文字列。 nullの場合、すべてのイベントにアタッチされているリスナーが解除されます。
削除するハンドラ。 nullの場合は、すべてのハンドラが削除されます。
リスナーがキャプチャリスナーかどうか。 nullの場合、キャプチャリスナーと非キャプチャリスナーの両方が解除されます。
削除されたリスナーの数。
コントロールにフォーカスを設定してそのすべての内容を選択します。
現在のロケールを使用して文字列に変換された日付を返します。
オブジェクトの文字列表現を返します。
指定されたオブジェクトのプリミティブ値を返します。
HTML要素に含まれるすべてのWijmoコントロールを破棄します。
コンテナー要素。
指定したDOM要素でホストされているコントロールを取得します。
コントロールをホストするDOM要素、またはホスト要素のCSS セレクター(例: '#theCtrl')。
指定したHTML要素に含まれるすべてのWijmoコントロールを無効化します。
このメソッドは、コントロールの表示状態やサイズを変更する 動的なパネルをアプリケーションで使用している場合に使用します。 たとえば、スプリッタ、アコーディオン、およびタブコントロールは通常、 その中の要素の表示状態を変更します。この場合、その要素に含まれるコントロールに通知しないと、 それらのコントロールが適切に機能しなくなる可能性があります。 これが起こる場合は、動的コンテナーで適切なイベントを処理し、 Control.invalidateAll メソッドを呼び出してコンテナー内のWijmoコントロールの レイアウト情報が適切に更新されるようにする必要があります。
コンテナー要素。nullに設定すると、ページ上に存在するすべてのWijmoコントロールが無効化されます。
HTML要素で存在するすべてのWijmoコントロールを更新する。
コントロールが時間おいて更新される代わりに直ちに更新されること以外はinvalidateAll メソッドと同様です。
コンテナー要素。nullに設定すると、ページ上に存在するすべてのWijmoコントロールが無効化されます。
コントロールがフォーカスを取得したときに発生します。
無効な文字が入力されたときに発生します。
ユーザーが入力した値が適切な種類に変換できない値、または有効な範囲外の値を貼り付ける場合、 無効な入力エラーが発生する場合があります。
イベントハンドラーがイベントをキャンセルする場合、 ユーザーがエラーを修正できるように、 コントロールは無効なコンテンツとフォーカスを保持します。
イベントがキャンセルされない場合、コントロールは無効な入力エラーを無視し、 元のコンテンツを保持します。
ドロップダウンが表示または非表示になった後に発生します。
ドロップダウンが表示または非表示になる前に発生します。
コントロールがフォーカスを失ったときに発生します。
rangeEnd プロパティの値がnull以外の値に変更されたときに発生します。 本動作は、データ範囲が選択されたことを示します。
rangeEnd プロパティの値が変更されたときに発生します。
コントロールが内容を更新した後で発生します。
コントロールが内容を更新する直前に発生します。
text プロパティの値が変更されたときに発生します。
value プロパティの値が変更されたときに発生します。
wijmo.input.InputDateRange コントロールに対応するAngular 2コンポーネント。
wj-input-date-range コンポーネントを使用して、Angular 2アプリケーションに InputDateRange コントロールを 追加できます。Angular 2マークアップの構文については、
「Angular 2マークアップ構文」を参照してください。.
WjInputDateRange コンポーネントは、 InputDateRange コントロールから派生され、 そのすべてのプロパティ、イベント、およびメソッドを継承しています。