Bootstrap + AngularJS 1.6.8
Bootstrap + AngularJS 1.6.8 BoilerPlate
by militellovincenzo
HTML
<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.8/angular.js"></script>
<script src="https://code.angularjs.org/1.6.8/angular-animate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div ng-app="app">
<button ng-click="alert('hi');">Click me</button>
</div>
CSS
.row {
background: #f8f9fa;
margin-top: 20px;
}
.col {
border: solid 1px #6c757d;
padding: 10px;
}
.finish-checkbox {
margin-left: .2em;
width: 25px;
height: 20px;
margin-top: 0;
}
}
JavaScript
angular.module('app', [])
.directive('ngConfirmClick', ngConfirm);
ngConfirm.$inject = ['$element', '$attrs'];
function ngConfirm() {
// Usage:
//
// Creates:
//
var directive = {
bindToController: true,
controller: ngConfirmController,
controllerAs: 'vm',
priority: -1,
restrict: 'A'
};
return directive;
}
ngConfirmController.$inject = ['$element', '$attrs', "$window"];
function ngConfirmController($element, $attrs, $window) {
$element.bind('click', function(e) {
var message = $attrs.ngConfirmClick;
// confirm() requires jQuery
if (message && !$window.confirm(message)) {
e.stopImmediatePropagation();
e.preventDefault();
}
});
}