AngularUI datepicker set json date

Using Angular UI Bootstrap datepicker in a project.

How to setup a angular js with json date as initial date? My server returns JSON date and using the same in angular scope object.

However it shows the same json notation in the textbox instead of the dd/MM/yyyy (20/08/2015) format which i expect

enter image description here

Code is

<input type="text" datepicker-popup="dd/MM/yyyy"  ng-model="model.GrnDate" is-open="openedGRNDatePicker" datepicker-options="dateOptions" close-text="Close"
                               class="form-control" />
                        <span class="input-group-btn">
                            <button type="button" ng-click="openDatePicker($event,'openedGRNDatePicker')" class="btn btn-default">
                                <em class="fa fa-calendar"></em>


$scope.model=data;//loaded from server
$scope.openDatePicker = function ($event, opened) {

    $scope[opened] = true;
$scope.dateOptions = {
    formatYear: 'yy',
    startingDay: 1

Source: json

Leave a Reply