guiomie
guiomie

Reputation: 5148

angular-ui and datepicker directive error

I am trying the following example/demo and I keep getting this error in my chrome console:

Error: Non-assignable model expression: undefined (directive: datepicker)

I dont get any 404s during the execution.

The code used is based on:

http://angular-ui.github.io/bootstrap/#/modal

or

http://plnkr.co/edit/?p=preview

The code in my modal template:

<pre>Selected date is: <em>{{dt | date:'fullDate' }}</em></pre>
    <div class="well well-small pull-left" ng-model="dt">
        <datepicker min="minDate" show-weeks="showWeeks"></datepicker>
    </div>

The code in modal controller:

$scope.today = function () {
        $scope.dt = new Date();
    };
    $scope.today();

    $scope.showWeeks = true;
    $scope.toggleWeeks = function () {
        $scope.showWeeks = !$scope.showWeeks;
    };

    $scope.toggleMin = function () {
        $scope.minDate = ($scope.minDate) ? null : new Date();
    };
    $scope.toggleMin();

    $scope.dateOptions = {
        'year-format': "'yy'",
        'starting-day': 1
    };

Upvotes: 2

Views: 2258

Answers (1)

guiomie
guiomie

Reputation: 5148

The solution is to define the ng-model in the datepicker:

<div class="well well-small pull-left" >
        <datepicker min="minDate" show-weeks="showWeeks" ng-model="dt"></datepicker>
    </div>

Upvotes: 3

Related Questions