Angularjs bootstrap datepicker: Select multiple dates

Question

I am trying to use the angular UI strap datepicker. How to select more than one date from the datepicker and return the value as an array.

http://mgcrea.github.io/angular-strap/#/datepicker

Answer 1

You can use gm.datepickerMultiSelect directive, that wraps around ui-bootstrap datepicker directive, adding multi-select feature.

<div ng-controller='AppCtrl'>
    <datepicker ng-model='activeDate' multi-select='selectedDates'></datepicker>
</div>


var myApp = angular.module('myApp',['gm.datepickerMultiSelect']);

function AppCtrl($scope) {
    $scope.activeDate;

    //THIS IS WHERE YOU CAN INITIALIZE VALUES
    $scope.selectedDates = [new Date().setHours(0, 0, 0, 0), new Date(2015, 2, 20).setHours(0, 0, 0, 0), new Date(2015, 2, 10).setHours(0, 0, 0, 0), new Date(2015, 2, 15).setHours(0, 0, 0, 0)];

    $scope.removeFromSelected = function (dt) {
        $scope.selectedDates.splice($scope.selectedDates.indexOf(dt), 1);
    }
}

There's an article on this on my blog http://irhadbabic.com/?p=351 Also, here's working JSFiddle that you can use http://jsfiddle.net/prdkvp7u/4/