AngularUI Bootstrap

AngularUI Bootstrap.markdown

AngularUI Bootstrap

Basic angularjs application with ui.bootstrap directives.

A Pen by B. Dylan Walker on CodePen.

License.

index.html

<div ng-app="MyApp" ng-controller="AppCtrl">
  <h1>AngularUI Bootstrap</h1>
  <h2>Date Picker</h2>
  
  <p>Date: {{dt | date:'longDate'}}</p>
  <datepicker ng-model="dt"></datepicker>
</div>

script.js

angular.module('MyApp', ['ui.bootstrap'])
  .controller('AppCtrl', function($scope) {
    $scope.dt = new Date();

  });

scripts

<script src="//code.angularjs.org/1.4.3/angular.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-animate.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-aria.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-cookies.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-loader.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-message-format.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-messages.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-resource.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-route.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-sanitize.min.js"></script>
<script src="//code.angularjs.org/1.4.3/angular-touch.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.1/ui-bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.1/ui-bootstrap-tpls.min.js"></script>

styles

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" rel="stylesheet" />