UNPKG

ng2-encrm-components

Version:
66 lines (61 loc) 2.01 kB
<div class="col-xs-12"> <h1 id="alerts">Alerts</h1> <en-alert *ngFor="let alert of alerts;let i = index" [type]="alert.type" [dismissible]="alert?.closable" (close)="closeAlert(i)"> {{ alert?.msg }} </en-alert> <alert type="danger" dismissible="true"> alert msg </alert> <br><br> <tabset> <tab heading="HTML"> <pre><code highlight class="html"> &lt;alert *ngFor=&quot;let alert of alerts;let i = index&quot; [type]=&quot;alert.type&quot; [dismissible]=&quot;alert?.closable&quot; (close)=&quot;closeAlert(i)&quot;&gt; &#123; &#123; alert.msg &#125; &#125; &lt;/alert&gt; </code></pre> </tab> <tab heading="TypeScript"> <pre><code highlight class="typescript"> @Component() export class AlertsPreviewComponent implements OnInit &#123; constructor() &#123; &#125; ngOnInit() &#123; &#125; /*---------------------------------------------------------- * ALERTS *---------------------------------------------------------*/ public alerts: Object[] = [ &#123; type: &#039;danger&#039;, msg: &#039;Oh snap! Change a few things up and try submitting again.&#039; &#125;, &#123; type: &#039;success&#039;, msg: &#039;Well done! You successfully read this important alert message.&#039;, closable: true &#125;, &#123; type: &#039;info&#039;, msg: &#039;Well done! You successfully read this important alert message.&#039;, closable: true &#125;, &#123; type: &#039;warning&#039;, msg: &#039;Well done! You successfully read this important alert message.&#039;, closable: true &#125; ]; public closeAlert(i: number): void &#123; this.alerts.splice(i, 1); &#125; &#125; </code></pre> </tab> </tabset> </div>