| <div ng-controller="PopoverDemoCtrl"> |
| <h4>Dynamic</h4> |
| <div class="form-group"> |
| <label>Popup Text:</label> |
| <input type="text" ng-model="dynamicPopover.content" class="form-control"> |
| </div> |
| <div class="form-group"> |
| <label>Popup Title:</label> |
| <input type="text" ng-model="dynamicPopover.title" class="form-control"> |
| </div> |
| <div class="form-group"> |
| <label>Popup Template:</label> |
| <input type="text" ng-model="dynamicPopover.templateUrl" class="form-control"> |
| </div> |
| <button uib-popover="{{dynamicPopover.content}}" popover-title="{{dynamicPopover.title}}" type="button" class="btn btn-default">Dynamic Popover</button> |
| |
| <button uib-popover-template="dynamicPopover.templateUrl" popover-title="{{dynamicPopover.title}}" type="button" class="btn btn-default">Popover With Template</button> |
| |
| <script type="text/ng-template" id="myPopoverTemplate.html"> |
| <div>{{dynamicPopover.content}}</div> |
| <div class="form-group"> |
| <label>Popup Title:</label> |
| <input type="text" ng-model="dynamicPopover.title" class="form-control"> |
| </div> |
| </script> |
| <hr /> |
| <h4>Positional</h4> |
| <button popover-placement="top" uib-popover="On the Top!" type="button" class="btn btn-default">Top</button> |
| <button popover-placement="left" uib-popover="On the Left!" type="button" class="btn btn-default">Left</button> |
| <button popover-placement="right" uib-popover="On the Right!" type="button" class="btn btn-default">Right</button> |
| <button popover-placement="bottom" uib-popover="On the Bottom!" type="button" class="btn btn-default">Bottom</button> |
| |
| <hr /> |
| <h4>Triggers</h4> |
| <p> |
| <button uib-popover="I appeared on mouse enter!" popover-trigger="mouseenter" type="button" class="btn btn-default">Mouseenter</button> |
| </p> |
| <input type="text" value="Click me!" uib-popover="I appeared on focus! Click away and I'll vanish..." popover-trigger="focus" class="form-control"> |
| |
| <hr /> |
| <h4>Other</h4> |
| <button popover-animation="true" uib-popover="I fade in and out!" type="button" class="btn btn-default">fading</button> |
| <button uib-popover="I have a title!" popover-title="The title." type="button" class="btn btn-default">title</button> |
| </div> |