Javascript Can'；我不能让一个管制员工作
经过多次尝试，我仍然无法让一个控制器正常工作。 我最近一直在做一些角度项目，无论我尝试什么，我的控制器都不起作用 在最后一个项目中，所有内容都在同一个html文件中，以下是我编写的完整代码：Javascript Can'；我不能让一个管制员工作,javascript,angularjs,controller,Javascript,Angularjs,Controller,经过多次尝试，我仍然无法让一个控制器正常工作。 我最近一直在做一些角度项目，无论我尝试什么，我的控制器都不起作用 在最后一个项目中，所有内容都在同一个html文件中，以下是我编写的完整代码： <!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="node_modules/angular-materi
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="node_modules/angular-material/angular-material.min.css">
<script src="node_modules/angular/angular.min.js"></script>
<script src="node_modules/angular-route/angular-route.min.js"></script>
<link href="node_modules/ng-material-floating-button/mfb/dist/mfb.min.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body layout="column" ng-app="MyApp">
<div id="welcomeDiv" style="display:none; position: fixed; height: 100%; width: 100%; left: 0; top: 0; background: rgba(51,51,51,0.4); z-index: 10;">
<div style="width: 50vw; background-color: #009aa6; margin: auto; margin-top:10vw; height: 26vw;">
<div style="font-size:2vw; color: white; margin-left: 0.8vw;">CREER UNE RESERVATION</div>
<div style="font-size: 1vw; color: white; margin-left: 0.8vw;">Titre de la réservation</div>
<input type="text" style="border-radius: 3px; border: none; margin-left: 0.8vw; width: 20vw; margin-top: 0.2vw; height: 1.8vw">
<div style="font-size: 1vw; color: white; margin-left: 0.8vw; margin-top: 1vw">Type</div>
<select class="form-control" style="margin-top: 0.2vw; margin-left: 0.8vw; width: 20vw; height: 1.8vw">
<option>Réunion</option>
<option>Evènement</option>
<option>Visite</option>
</select>
<div style="font-size: 1vw; color: white; margin-left: 0.8vw; margin-top: 2.4vw;">Description</div>
<input type="text" style="border-radius: 3px; border: none; margin-left: 0.8vw; width: 20vw; margin-top: 0.2vw; height: 10vw">
<div ng-controller="AppCtrl" style='padding: 40px;' ng-cloak>
<md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
</div>
<input type="button" name="answer" value="Cacher" onclick="hideDiv()" style="margin-left: 1vw; float: bottom; width: 4vw;" />
</div>
</div>
<div id="contenu">
<md-toolbar>
<div class="cyanMenu">
<div class="white">
<a href="#demo" data-toggle="collapse" style="color: white; text-decoration: none;"><i class="fa fa-angle-down" style="text-shadow: 0 0 8px #555; margin-right: 3vw;"></i>1 MAI 2016</a>
<div id="demo" class="collapse">
MauvaisDéploiment
</div>
</div>
</div>
</md-toolbar>
<div class="container" layout="row">
<md-sidenav md-is-locked-open="false" class="nav">
<div class="cyanNav">574</div>
<div class="whiteText">Nantes</div>
<i class="material-icons" style="font-size: 4vw; margin-left: 1.8vw; margin-top: 2vw; color: white;">date_range</i>
<i class="material-icons" style="font-size: 4vw; margin-left: 1.8vw; margin-top: 2vw; color: white;">notifications</i>
<i class="material-icons" style="font-size: 4vw; margin-left: 1.8vw; margin-top: 2vw; color: white;">equalizer</i>
</md-sidenav>
<md-content id="content">
</md-content>
</div>
<input type="button" name="answer" value="+" onclick="showDiv()" style="margin-left: 6.5vw; bottom: 0; margin-bottom: 3vw; position: absolute" class="bout_rond"/>
</div>
<script src="node_modules/angular-animate/angular-animate.js"></script>
<script src="node_modules/angular-aria/angular-aria.min.js"></script>
<script src="node_modules/angular-material/angular-material.min.css"></script>
<script>
'use strict';
angular.module( 'MyApp', ['ngMaterial', 'ngMessages']).controller('AppCtrl', function($scope) {
$scope.myDate = new Date();
$scope.minDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth() - 2,
$scope.myDate.getDate());
$scope.maxDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth() + 2,
$scope.myDate.getDate());
$scope.onlyWeekendsPredicate = function(date) {
var day = date.getDay();
return day === 0 || day === 6;
};
});
function showDiv() {
document.getElementById('welcomeDiv').style.display = "block";
document.getElementById('contenu').style.display = "none";
}
function hideDiv() {
document.getElementById('welcomeDiv').style.display = "none";
document.getElementById('contenu').style.display = "block";
}
</script>
<style>
.nav {
background-color:#3e3d40;
width:8%;
box-shadow: 5px 0px 20px -1px #888;
z-index: 2;
}
.bout_rond {
display:block;
width:3vw;
height:3vw;
line-height:3vw;
border-radius: 50%;
color:#f5f5f5;
text-align:center;
text-decoration:none;
background: #009aa6;
box-shadow: 5px 0px 20px -1px #888;
font-size:1.4vw;
font-weight:bold;
z-index: 3;
}
.cyanNav {
margin-left: 15%;
color:#009aa6;
font-size: 3vw;
}
.cyanMenu {
background-color:#009aa6;
font-size: 3.8vw;
margin-left: 6%;
z-index: -1000;
}
.whiteText {
color: white;
margin-left: 15%;
font-size: 2vw;
margin-top: -15%;
}
.white {
color: white;
margin-left: 4%;
}
.content {
background-color: #c7czba;
}
[ng-cloak] {
display: none;
}
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(rsc/MaterialIcons-Regular.woff);
src: local('Material Icons'),
local('MaterialIcons-Regular'),
url(rsc/MaterialIcons-Regular.woff2) format('woff2'),
url(rsc/example.com/MaterialIcons-Regular.woff) format('woff'),
url(rsc/example.com/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px; /* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga';
}
</style>
</body>
</html>
var app=angular.module（…）函数（）中，但仍然得到相同的错误
我肯定我错过了什么，但找不到它是什么
哦，如果您想了解整个“工作”项目，这里有一个指向cloud9项目的链接：
您的代码失败，因为您已将ngMaterial列为MyApp
的依赖项，但从未加载角度材质库。修复此问题很简单，只需在html中添加如下脚本标记：
<script src="node_modules/angular-material/angular-material.js"></script>
您似乎还没有加载ngMessages库，因此您还必须为此添加一个脚本标记：
<script src="url/to/ngMessages/library"></script>
第一个错误发生在您将css
文件作为脚本包含时
<script src="node_modules/angular-material/angular-material.min.css"></script>
你能先把你所有的脚本标签移到body标签下面吗？全部？甚至是angular.js？编辑：已移动所有“…”文件，但仍会收到错误。请先放置jquery文件angular@AranS这与解决问题毫不相干。为什么.css文件会包含javascript…这不是一个很大的线索吗？我怎么会错过这个。。。那就多谢了。即使如此，我的sidenav消失了，我没有得到任何错误，但这次我会自己发现问题。
<script src="node_modules/angular-material/angular-material.min.css"></script>
<script src="node_modules/angular-material/angular-material.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-messages.js"></script>