为什么我的AngularJS模块从未加载？

Question

我是AngularJS的新手,并且很难让AngularJS表单正常工作.Chrome开发工具告诉我我的模块没有被加载.

下面是我的HTML; 它是Wordpress模板中的div:

<div ng-app="contact" style="float: left;">
    <form method="post" name="form" role="form" ng-controller="ContactFormController" ng-submit="form.$valid && sendMessage(input)" novalidate>
    <p ng-show="success">Thanks for getting in touch!</p>
    <p ng-show="error">Something wrong happened!, please try again.</p>
    <legend>Contact</legend>
    <fieldset>
    <div>
      <label for="name">Name:</label>
      <input type="text" id="name" name="name" ng-model="input.name" required>
    </div>
    <div>
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" ng-model="input.email" required>
    </div>
    <div>
        <label for="messsage">Message:</label>
        <textarea id="messsage" name="message" ng-model="input.message" required></textarea>
    </div>
    <div>
        <label for="honeypot">I promise I'm not a bot</label>
        <input type="text" id="honeypot" name="honeypot" ng-model="input.honeyPot">
    </div>
    </fieldset>
    <button type="submit" name="submit" value="submit">Submit</button>
    </form>
    </div>

这是我的角度代码:

angular.module("contact", [])
    .controller("ContactFormController", ['$scope', '$http', function($scope, $http) {
    $scope.success = false;
    $scope.error = false;

    $scope.sendMessage = function( input ) {
        $http({
            method: 'POST',
            url: 'http://alamanceforeducation.org/wp-content/themes/flex/library/scripts/processApplecartForm.php',
            data: input,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        })
            .success( function(data) {
                if ( data.success ) {
                    $scope.success = true;
                } else {
                    $scope.error = true;
                }
            } );
    }
}]);

代码改编自教程.任何人都能帮我解决我做错的事吗？

Answer 1

就您遇到的问题而言,您的代码没有任何问题.问题是您加载脚本的顺序.

订单应该是:1- angular.js 2- any-angular-dependency.js 3-your-angular-app.js

这是你的代码的工作副本 我不包括表单,因为只是为了告诉你它没有找到你的角度模块,因为要么你没有包含它或者没有正确加载cdn,你可能想要下载它在本地拥有它并包含<script src="angular.js"></script>标签