JSFiddle - React, Tailwind, and code Playground

by Alaksandar Jesus Gene

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.1/ui-bootstrap-tpls.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<div ng-app = "myApp">
    
   <div ng-controller="myCtrl" style="margin-top:20px;">
       <alert ng-repeat="alert in cantVoteWhenNotLoggedInAlerts" type="{{alert.type}}"
      close="closeCantVoteWhenNotLoggedInAlert($index)">{{ alert.msg }}</alert>
       
       
    </div>
</div>

JavaScript

var myApp = angular.module('myApp',['ui.bootstrap']);
myApp.controller('myCtrl',function($scope){
    $scope.cantVoteWhenNotLoggedInAlerts=[];
 $scope.cantVoteWhenNotLoggedInAlerts.push({
                    type: 'warning',
                    msg: 'Must be logged in'
                });                                

$scope.closeCantVoteWhenNotLoggedInAlert = function (index) {
            $scope.cantVoteWhenNotLoggedInAlerts.splice(index, 1);
        };

});