Defining the Pane Template

You need to define a template to act as the pane for the tabbed view. The pane is just a container that can hold whatever content you want to add. Listing 29.4 shows the basic pane template with a single <div> element.

You assign a pane class to an element for styling, and you use the ng-show directive to show the pane only when selected is true, and you use the ng-transclude directive to allow wrapping of content.

Listing 29.4 rich_pane.html: Implementing the pane template view for the tabbed view

01 <div class="pane"
02      ng-show="selected"
03      ng-transclude>
04 </div>