-2
經過多次嘗試後，我仍然無法讓單個控制器正常工作。 最近我一直在做一些角度項目，無論我嘗試使用我的控制器都不起作用。無法讓控制器工作AngularJS
在這最後的項目一切都是在同一個HTML文件，這裏是完整的代碼，我在工作：
<!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>
我得到2個錯誤：
Uncaught SyntaxError: Unexpected token {
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=MyApp&p1=Error%3A%2…4-millenium.c9users.io%2Fnode_modules%2Fangular%2Fangular.min.js%3A21%3A19)
（導致一個關於ngRoute的角度頁面，我真的不明白）
我試過一些東西，如創建一個var app = angular.module(...)，但是當我如果我得到一個錯誤，表示該應用程序不是函數，那麼我嘗試將整個腳本放在function()之內，但仍然會出現相同的錯誤。
我確定我一直在想念什麼，但找不到它是什麼。
哦，這裏是對CLOUD9項目的鏈接，如果你想給看一下整個「工作」項目： https://ide.c9.io/millenium/test574-cloned
你能先移動身體標籤下的所有腳本標記？ – AranS
所有這些？即使是angular.js之一？ 編輯：移動所有''文件，仍然出現錯誤。 – CamilleSNCF
先把jquery文件先放到角度 – Rakeschand