OnsCheckbox Directive (ons-checkbox)

<ons-checkbox>要素のAngularディレクティブです。 [(ngModel)] を使用すると、 [(ngModel)] の値を選択された値の配列と同期することができます。

実例

Checkboxes

Checkboxes are defined using the <ons-checkbox> element. The element works almost exactly as when you use a normal <input type="checkbox"> element.

<ons-checkbox value="something" checked></ons-checkbox>

Inner input element

For normal input elements is possible to define a <label> tab with the for attribute to link it to an input element.

Unfortunately this does not work with custom elements like <ons-label> so in order to do it we need to set the id attribute of the inner input element. This is done using the input-id attribute.

<label for="username">Username</label>
<ons-input input-id="username"></ons-input>

This work with any input in Onsen UI such as checkboxes, radios, etc.

関連情報

名前 型 / デフォルト値 概要
input-id String Specify the “id” attribute of the inner <input> element. This is useful when using <label for="..."> elements. (翻訳中) Optional.
名前 概要
value The current value of the checkbox. (翻訳中)
checked Whether the checkbox is checked or not. (翻訳中)
disabled 無効化されている場合にtrue
Name 概要
material Displays a Material Design checkbox. (翻訳中)
noborder iOS borderless checkbox. (翻訳中)
シグネチャ 概要
focus() Focuses the checkbox. (翻訳中)
blur() Removes focus from the checkbox. (翻訳中)
focus()

Focuses the checkbox. (翻訳中)

blur()

Removes focus from the checkbox. (翻訳中)

お困りですか?

Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。

バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。

あわせて、下記の情報も参考にしてください。