2016-12-24 8 views
5

Ich baue gerade eine Web-Anwendung mit Angular und ich benutze Angular Material für einige UI-Komponenten. Derzeit habe ich ein Problem, das ich nicht lösen kann. Wenn ich den Datepicker wie auf https://material.angularjs.org/latest/demo/datepicker beschrieben benutze, öffnet sich das Fenster, aber es bleibt leer. enter image description hereAngular Material Datepicker ist leer

Hier ist das Code-Snippet für den Datepicker.

<md-datepicker ng-model="vm.registrationData.birthDate" 
            md-placeholder="{{'start_register_birth_date' | translate}}" 
            required></md-datepicker> 
        <div class="error-message" 
         ng-messages="registerForm.birthDate.$error" 
         ng-if="registerForm.birthDate.$touched && registerForm.birthDate.$invalid"> 
         <div class="arrow-right"></div> 
         <p ng-message="required">{{'start_register_error_birthDate_required' | translate}}</p> 
        </div> 

Gibt es vielleicht etwas falsch mit meinen Einfuhren?

<!-- bower:js --> 
<script src="bower_components/angular/angular.js"></script> 
<script src="bower_components/angular-animate/angular-animate.js"></script> 
<script src="bower_components/angular-messages/angular-messages.js"></script> 
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script> 
<script src="bower_components/angular-translate/angular-translate.js"></script> 
<script src="bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js"></script> 
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script> 
<script src="bower_components/angular-cookies/angular-cookies.js"></script> 
<script src="bower_components/angular-aria/angular-aria.js"></script> 
<script src="bower_components/angular-material/angular-material.js"></script> 
<script src="bower_components/moment/moment.js"></script> 
<!-- endbower --> 
<script src="js/app.min.js"></script> 
<script src="js/config.min.js"></script> 

<!-- bower:css --> 
<link rel="stylesheet" href="bower_components/angular-material/angular-material.css" /> 
<!-- endbower --> 
<link rel="stylesheet" type="text/css" href="css/styles.css" /> 
+0

Können Sie eine funktionierende Geige daraus machen? –

+0

Haben Sie Konsolenfehler? – chaoticmind

+0

Nein, es gibt keine Konsolenfehler. Das war meine erste Hoffnung :( – Kahuna

Antwort

18

Verwenden Sie eine ältere Version von Angular, sagen wir 1.5.9. Angular 1.6 deaktiviert die Vorbindung von Controllern.

Weitere Informationen finden Sie unter Issue #10168. Sie können hinzufügen

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

, wenn Sie auf die Verwendung von Angular 1.6 bestehen.

+1

Danke, das löste mein Problem! – Kahuna

+0

Nur aktualisiert und lief in das. Danke! –

+0

Wow, Sie haben mir gerade mehrere Stunden des Entschlüsselns einen komplett verschluckten Fehler gerettet. Vielen Dank! –