スイッチを表示するコンポーネントです。
A switch is an UI element that can be used to toggle between two states.
The state of a switch in Onsen UI can be changed both by dragging the knob and by tapping on the switch.
To make the switch enabled by default you can use the checked attribute just like with radio buttons and checkboxes.
<ons-switch checked>
</ons-switch>
To disable the switch the disabled attribute is used.
<ons-switch disabled>
</ons-switch>
ons-switch can be combined with ng-model in order to bind its value with a scope variable.
| 名前 | 型 / デフォルト値 | 概要 |
|---|---|---|
| modifier | String | スイッチの表現を指定します。 Optional. |
| disabled | スイッチを無効の状態にする場合に指定します。 Optional. | |
| checked | スイッチがONの状態にするときに指定します。 Optional. | |
| input-id | String |
Specify the id attribute of the inner <input> element. This is useful when using <label for="..."> elements.
（翻訳中）
Optional.
|
| var | String | JavaScriptから参照するための変数名を指定します。 Optional. 初期化時のみ有効 |
| 名前 | 概要 |
|---|---|
| checked |
スイッチがONの場合にtrue。
|
| value | The current value of the input. （翻訳中） |
| disabled |
無効化されている場合にtrue。
|
| checkbox | コンポーネント内部のcheckbox要素になります。 |
| Name | 概要 |
|---|---|
| material | Material Design switch （翻訳中） |
| シグネチャ | 概要 |
|---|---|
| focus() | Focuses the switch. （翻訳中） |
| blur() | Removes focus from the switch. （翻訳中） |
| on(eventName, listener) | イベントリスナーを追加します。 |
| once(eventName, listener) | 一度だけ呼び出されるイベントリスナーを追加します。 |
| off(eventName, [listener]) | イベントリスナーを削除します。もしイベントリスナーを指定しなかった場合には、そのイベントに紐づく全てのイベントリスナーが削除されます。 |
Focuses the switch. （翻訳中）
Removes focus from the switch. （翻訳中）
イベントリスナーを追加します。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | このイベントが発火された際に呼び出される関数オブジェクトを指定します。 |
一度だけ呼び出されるイベントリスナーを追加します。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | イベントが発火した際に呼び出される関数オブジェクトを指定します。 |
イベントリスナーを削除します。もしイベントリスナーを指定しなかった場合には、そのイベントに紐づく全てのイベントリスナーが削除されます。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | 削除するイベントリスナーを指定します。 |
| 名前 | 概要 |
|---|---|
| change | ON/OFFが変わった時に発火します。 |
ON/OFFが変わった時に発火します。
| 名前 | 型 | 概要 |
|---|---|---|
| event | Object | イベントオブジェクト。 |
| event.switch | Object | イベントが発火したSwitchオブジェクトを返します。 |
| event.value | Boolean | 現在の値を返します。 |
| event.isInteractive | Boolean | タップやクリックなどのユーザの操作によって変わった場合にはtrueを返します。 |
Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。
バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。
あわせて、下記の情報も参考にしてください。