​
Description

The toggle controls directive

​
Usage

as element: 
<toggle:controls
       labels="{string}"
       panes="{string}"
       [title="{string}"]>
</toggle:controls>

​
Directive info

  • This directive creates new scope.

​
Parameters

ParamTypeDetails
labelsstringLabels that describe each corresponding pane. There must be exactly the same number of labels as there are panes.
panesstringThis parameter associates the controls with the corresponding panes by referencing the panes’ id parameter.
title (optional)stringThe title of the pane controls.

​
Example

​
Source

<toggle:controls labels="Pane 1, Pane 2, Pane 3" panes="panes"></toggle:controls>
<toggle:panes id="panes">
    <toggle:pane>
        <h3 id="example_pane-1">Pane 1</h3>
    </toggle:pane>
    <toggle:pane>
        <h3 id="example_pane-2">Pane 2</h3>
    </toggle:pane>
    <toggle:pane>
        <h3 id="example_pane-3">Pane 3</h3>
    </toggle:pane>
</toggle:panes>

​
Result

Result