<div class="header-panel member">
<h2><span class="identifier">WjPopup</span> Class</h2>
<dl class="dl-horizontal">
<dt>File</dt><dd class="filename">wijmo.angular.js</dd>
<dt>Module</dt><dd><a href="topic/wijmo.angular.Module.html"><span class="identifier">wijmo.angular</span></a></dd>
<dt>Show</dt>
<dd>
<label><input type="checkbox" ng-model="ctx.showInherited"> Inherited Members</label>&nbsp;&nbsp;&nbsp;
<label><input type="checkbox" ng-model="ctx.showRaisers"> Event Raisers</label>
</dd>
</dl>
<div class="comment"><p>AngularJS directive for the <a href="topic/wijmo.input.Popup.Class.html"><span class="identifier">Popup</span></a> control.</p>
<p>Use the <b>wj-popup</b> directive to add <a href="topic/wijmo.input.Popup.Class.html"><span class="identifier">Popup</span></a> controls to your 
AngularJS applications.</p>
<p>The popup content may be specified inside the <b>wj-popup</b> tag, and can
contain an arbitrary HTML fragment with AngularJS bindings and directives.</p>
<p>Note that directive and parameter names must be formatted as lower-case with dashes
instead of camel-case. For example:</p>


<pre>&lt;p&gt;Here is a Popup control triggered by a button:&lt;/p&gt;
&lt;button id="btn2" type="button"&gt;
    Click to show Popup
&lt;/button&gt;
&lt;wj-popup owner="#btn2" show-trigger="Click" hide-trigger="Blur"&gt;
    &lt;h3&gt;
        Salutation
    &lt;/h3&gt;
    &lt;div class="popover-content"&gt;
        Hello {&#8203;{firstName}} {&#8203;{lastName}}
    &lt;/div&gt;
&lt;/wj-popup&gt;</pre>
<p>The <b>wj-popup</b> directive supports the following attributes:</p>
<p><dl class="dl-horizontal">
  <dt>control</dt>         <dd><code>=</code> A reference to the Popup control created by this directive.</dd>
  <dt>fade-in</dt>         <dd><code>@</code> A boolean value that determines whether popups should be shown using a fade-in animation.</dd>
  <dt>fade-out</dt>        <dd><code>@</code> A boolean value that determines whether popups should be hidden using a fade-out animation.</dd>
  <dt>hide-trigger</dt>    <dd><code>@</code> A <a href="topic/wijmo.input.PopupTrigger.Enum.html"><span class="identifier">PopupTrigger</span></a> value defining the action that hides the <a href="topic/wijmo.input.Popup.Class.html"><span class="identifier">Popup</span></a>.</dd>
  <dt>initialized</dt>     <dd><code>&</code> This event occurs after the binding has finished initializing the control with attribute values.</dd>
  <dt>is-initialized</dt>  <dd><code>=</code> A value indicating whether the binding has finished initializing the control with attribute values. </dd>
  <dt>owner</dt>           <dd><code>@</code> A CSS selector referencing an element that controls the popup visibility.</dd>
  <dt>show-trigger</dt>    <dd><code>@</code> A <a href="topic/wijmo.input.PopupTrigger.Enum.html"><span class="identifier">PopupTrigger</span></a> value defining the action that shows the <a href="topic/wijmo.input.Popup.Class.html"><span class="identifier">Popup</span></a>.</dd>
  <dt>modal</dt>           <dd><code>@</code> A boolean value that determines whether the <a href="topic/wijmo.input.Popup.Class.html"><span class="identifier">Popup</span></a> should be displayed as a modal dialog.</dd>
  <dt>got-focus</dt>       <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#gotFocus"><span class="identifier">gotFocus</span></a> event handler.</dd>
  <dt>lost-focus</dt>      <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#lostFocus"><span class="identifier">lostFocus</span></a> event handler.</dd>
  <dt>showing</dt>         <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#showing"><span class="identifier">showing</span></a> event handler.</dd>
  <dt>shown</dt>           <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#shown"><span class="identifier">shown</span></a> event handler.</dd>
  <dt>hiding</dt>          <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#hiding"><span class="identifier">hiding</span></a> event handler.</dd>
  <dt>hidden</dt>          <dd><code>&</code> The <a href="topic/wijmo.input.Popup.Class.html/#hidden"><span class="identifier">hidden</span></a> event handler.</dd>
</dl></p></div>
</div>
<div class="member-panel class members" ng-class="{ 'show-inherited' : ctx.showInherited, 'show-raisers' : ctx.showRaisers }">
</div>
