javascript - 如何调试这个 Angular js代码？

Question

当 Angular 内部发生错误时，调试对我来说似乎是不可能的。我有这段代码:

<script>
    var my_app = angular.module("campaign_listing", ['$http']);
    var controllers = {};
    controllers.campaign_list_controller = function($http){
        var filters = {};
        var campaigns = {};
        this.update_fields = function(){
            console.log("update!");
        }
    }
    my_app.controller(controllers);
</script>

它抛出这个错误:

    angular.js:38Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.6/$injector/modulerr?p0=campaign_listing&p1…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.6%2Fangular.min.js%3A19%3A463)

And without the minified version:

Uncaught Error: [$injector:modulerr] Failed to instantiate module campaign_listing due to:
Error: [$injector:modulerr] Failed to instantiate module $http due to:
Error: [$injector:nomod] Module '$http' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.4.6/$injector/nomod?p0=%24http

我没有使用路由，所以那个链接实际上让我感到困惑。 有人可以告诉我问题是什么以及将来如何调试吗？

Answer 1

您可以在 my_app.controller() 行中创建断点并进入 Angular 代码(祝您好运，这对初学者来说很难)。

仅通过阅读您的代码，我建议您尝试一下:

<script>
    var my_app = angular.module("campaign_listing", []);
    var campaign_list_controller = function($http){
        var filters = {};
        var campaigns = {};
        this.update_fields = function(){
            console.log("update!");
        }
    }
    my_app.controller('campaign_list_controller', campaign_list_controller);
</script>

我想您以后可能会遇到更多问题，因为这一切看起来都不太像典型的 Angular 代码。我的建议:先尝试使用教程进行练习。