所以我创建了一个Angular 应用程序（版本 1.5.7）并想将它部署到 heroku。
我必须实现 Node 并使用 express 为 heroku 构建主 index.html 文件提供服务，因为它不接受普通的 Angular 应用程序。但是，当我这样做时，我的两个控制器都坏了。我的联系表单控制器没有呈现我的 ng 消息，而我的页脚控制器根本没有呈现。
在控制台中我得到一个错误，上面写着“[ng:areq] Argument 'contactCtrl' is not a function, got undefined”
您可以在此处查看实时构建 - https://fathomless-scrubland-50887.herokuapp.com和我在此处的项目的 github - https://github.com/StephenGrable1/AngularJS-Single-Page
这是我的快递server.js文件
var express = require('express');
var app = express();
var port = process.env.PORT || 8080;
app.use(express.static(__dirname));
app.get('/', function(req, res) {
res.sendfile('index.html', {root: __dirname })
});
app.listen(port, function() {
console.log('Our app is running on port ' + port);
});
在我实现 node 和 express 之前，这两个控制器工作正常。
页脚.js
angular
.module('Single-Page-App')
.directive('appFooter', function () {
return {
restrict: 'E',
template: '© Name {{ getYearCtrl.date | date:"yyyy" }}',
controller: function(){
this.date = Date.now();
},
controllerAs:'getYearCtrl'
};
});
联系人Ctrl.js
angular
.module('Single-Page-App')
.controller('contactCtrl', ['$scope', '$http', function($scope, $http){
$scope.contact = {name : '', email : '', subject : '', message : ''};
$scope.submitForm = function() {
var config = {
method: 'POST',
url : '../php/process-form.php',
data : {
'name' : $scope.contact.name,
'email': $scope.contact.email,
'subject': $scope.contact.subject,
'message' : $scope.contact.message
}
};
var request = $http(config);
request.then(function (response){
if(typeof(response.data) == 'string') {
// make all error messages blank when
// php return a string (which is the success message)
// which means there are no error messages being sent from php
$scope.nameError = "";
$scope.messageError = "";
$scope.subjectError = "";
$scope.emailError = "";
// put the success string from php into
// the successMsg so it can be accessed in the view
$scope.successMsg = response.data;
// clear all form values
// and set the inputs to prisitine and untouched
// so that angular will not display any error messages
// once a user submits the form successfully
$scope.contact = {};
$scope.contactForm.$setPristine();
$scope.contactForm.$setUntouched();
console.log($scope.successMsg);
console.log("not an object");
} else {
if(typeof(response.data) == 'object') {
// if php sends an object
// (which contains all the error messages present)
// populate variables with error messages
$scope.nameError = response.data['name-error'];
$scope.messageError = response.data['message-error'];
$scope.subjectError = response.data['subject-error'];
$scope.emailError = response.data['email-error'];
//clear the success message if errors come back from php
$scope.successMsg = "";
console.log("it is an object");
}
}
}, function (error){
$scope.msg = error.data;
console.log($scope.msg);
});
}
}]);
我不确定是什么破坏了我的控制器的功能......
编辑：这是我的 main.js 文件与路线
var app = angular.module('Single-Page-App', ['ui.router', 'ngMessages']);
app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state("home", {
url:"/home",
views: {
"main@": {
templateUrl: "partials/home.html"
}
}
})
.state("listen", {
url:"/listen",
views: {
"main@": {
templateUrl: "partials/listen.html"
}
}
})
.state("watchHere", {
url:"/watch",
views: {
"main@": {
templateUrl: "partials/watch.html"
}
}
})
.state("contact", {
url:"/contact",
views: {
"main@": {
templateUrl: "partials/contact.html"
}
}
})
}])
angular.bootstrap(document, ['Single-Page-App']);