Question

我是Angular的新手，无法弄清楚如何在控制台中测试它。我习惯于将变量值输出到控制台，因为我编码以检查值是否是我认为的值。例如，如果我想获得数组的长度，我会在代码中执行console.log(myArray.length)。如果我把它放在我的控制器功能内部，没有任何反应。如果我把它放在我的控制器里面的函数里面没有任何反应？我知道我可以用$ 0检查一个特定的元素但是这对测试代码没有帮助，我不想在代码中输入代码来测试方面......现在我没有在上下文中使用Angular MEAN堆栈 - 我只是在MAMP中使用html，js，bootstrap和angular;所以，我没有使用节点或测试框架。我需要吗？如果是这样，我可以使用测试框架而无需使用node / express配置项目环境吗？谢谢你的帮助。

angular.module('foil')

.controller('DonorListCtlr', function($scope, $http, $log, $httpParamSerializerJQLike){

    $scope.donors = []; 


    $http.get('api/list_donors.php').then(function(response){
        $scope.donors = response.data;
    });

    //create list of tabs
    $scope.tabs = [];

    $log.log('your stuff');

    $scope.gifts = [];  

    $scope.openTab = function(donor) {
        var newDonor = angular.copy(donor);
        $http.post('api/get_gifts.php', $httpParamSerializerJQLike({id: donor.id}), 
        { headers: { 'Content-Type': 'application/x-www-form-urlencoded'}}).then(function(response) {
            $scope.tabs.push({donor: newDonor, gifts: response.data});
        });

    };

    //add ability to close tab  
    $scope.closeTab = function($index) {
        $scope.tabs.splice($index, 1);
    };


    //submit form fields to process php to update donor details
    $scope.saveDonor = function(donor) {
        $http.post('api/process.php', 
        $httpParamSerializerJQLike({
            'donor_first': donor.donor_fname,
            'donor_last': donor.donor_lname, 
            id: donor.id 
            }), 
        {headers: { 'Content-Type': 'application/x-www-form-urlencoded'}} ).then(function() {
            for(var i=0; i< $scope.donors.length; i++) {
                if($scope.donors[i].id === donor.id) {
                    $scope.donors[i] = donor;
                    break;
                }
            }
        });
    };
});

Answer 1

如果您在控制器中返回此类控件并将此控制器包含在HTML页面中。然后在没有设置任何环境的情况下，console.log应该正常工作。在控制器写入： 'use strict';

angular.module('testApp', [])
    .controller('TestController', function() {
        console.log("Hello");
    });

在HTML中写道：

<!DOCTYPE html>
<html lang="en" ng-app="testApp">

    <head>
        <!--whatever files you need to add for css and bootstrap-->
    </head>
    <body ng-controller="TestController">
        <script src="angular.js"></script>
        <script src="controller.js"></script>
    </body>
</html>

然后你console.log（“你好”）;应该在控制台中显示消息。如果这不是您的答案，请发布您的代码并创建一个plunker

Answer 2

尝试$log.log('your stuff');

确保将$ log注入控制器

添加类似这样的内容

$scope.donors = []; 
$scope.GetDonors = function (){
$http.get('api/list_donors.php').then(function(response){
    $scope.donors = response.data;
});
};    
$log.log($scope.donors);

你必须从外面调用GetDonors，这将设置你的捐赠者。

如何从角度代码中输出到控制台？

2 个答案: