CODEWITHSUNDEEP
angularjsangular-material
Luiz Rossi
Luiz Rossi

Reputation: 892

Angular Material Date Picker With blank calendar

I'm having some troubles using date-picker in angular-material version 1.1.1, if I change to angular material 1.1.0 the calendar works, as I put on codepen: http://codepen.io/lhrossi/pen/eBQLoy

here is my HTML: 

<md-content md-theme="infocargas" layout-padding>
    <form name="newDeliveryForm">
        <div layout-gt-xs="row">
            <md-input-container class="md-block" flex-gt-xs>
                <label>Operador Logístico (Bloqueado)</label>
                <input ng-model="company" disabled /> 
            </md-input-container>
        </div>

        <div layout-gt-sm="row">

            <md-input-container flex-gt-sm>
                <label>Digite CTe</label>
                <input ng-model="delivery.cte" />
            </md-input-container>

        </div>

        <div layout-gt-sm="row">

            <md-input-container flex-gt-sm>
                <label>Entrega Para</label>
                <!--<md-datepicker ng-model="myDate"></md-datepicker>-->
                <md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>

            </md-input-container>

        </div>
        <md-button class="md-raised md-primary">Gerar Código</md-button>

    </form>

</md-content>

This is a bug, or there is other thinks to do? I'm afraid to change the material version to not bug other things on the system.

I appreciate any help.

Upvotes: 4

Views: 1750

Answers (1)

Vi100
Vi100

Reputation: 4204

Angular 1.6 introduces some optimizations on the compiler that break the functionality of the datepicker (they are listed as breaking changes in the Angular changelog).

While the Angular Material team doesn't release a new patch version (that could be in a year or two...) it won't work, but you can disable the some angular optimizations to go back to the previous behaviour, as described in this issue on the Material repo.

angular.module('myApp', []).config(function($compileProvider) {
    $compileProvider.preAssignBindingsEnabled(true);
});

Basically, what you do here is configuring the $compileProvider to work as it usually did. If you don't make this, then the initialitation code of the components is expected to reside on the $onInit() callback, as stated in this breaking change on Angular's changelog

Upvotes: 5

Related Questions