Question

我有一些代码来检测条形码扫描。当它直接在AngularJS控制器中时它正在工作。由于另一个控制器也需要使用该代码，我将扫描代码放在一个单独的JS文件中，这样他们就可以使用它了。我的研究表明，如果我将它们包含在HTML页面中，那么从另一个调用JS文件应该可行。我做到了。但是在扫描代码检测到扫描后，它会尝试在另一个控制器上调用一个方法，但是我收到了这个错误：

0x800a1391 - JavaScript运行时错误：'onBarcodeScan'未定义

在barcodeScan.js中：

setTimeout(function () {
    if (chars.length == 12) {
        var barcode = chars.join("");
        onBarcodeScan(barcode);  // Error occurs here
    }
    chars = [];
    pressed = false;
}, 500);

在我的AngularJS控制器中：

var onBarcodeScan = function (barcode) {
    $scope.$apply(function () {
        $scope.state.userEnteredSubId = barcode;
        $scope.onSubmitSubId();
    });
}

我错过了什么？

注意：我的控制器代码首先列在索引HTML页面中：

<script src="js/cassetteController.js"></script>
<script src="js/barcodeScan.js"></script>

Answer 1

我发现了一篇解释using events in an AngularJS factory的帖子。这是工作代码：

<强>控制器：

scannerService.notify();

scannerService.subscribe($scope, function () {
    // Handle notification
    $scope.$apply(function () {
        $scope.state.userEnteredSubId = $rootScope.scan;
        $scope.onSubmitSubId();
    });
});

<强>工厂：

app.factory('scannerService', ['$http', '$rootScope', function ($http, $rootScope) {
    var listenerAdded;

    return {
        subscribe: function (scope, callback) {
            var handler = $rootScope.$on('notifying-service-event', callback);
            scope.$on('$destroy', handler);
        },

        initialize: function () {
            if (listenerAdded) {
                return;
            }
            // From http://www.deadosaurus.com/detect-a-usb-barcode-scanner-with-javascript/:
            listenerAdded = true;
            var pressed = false;
            var chars = [];
            document.addEventListener('keydown', function (event) {
                // Ignore this if the user is hitting enter, or any other non-number.
                if (event.keyCode < 48 || event.keyCode > 57) {
                    return;
                }
                // Only capture numbers, because a subId is all numbers.
                if (event.keyCode >= 48 && event.keyCode <= 57) {
                    // Note: Theys keycodes are only for numbers along the top of the keyboard; the number pad uses a different range.
                    chars.push(String.fromCharCode(event.keyCode));
                }
                console.log(event.keyCode + ":" + chars.join("|"));
                if (pressed == false) {
                    // The JS setTimeout method would cause us to have to use $scope.apply(). Instead, just use Angular's $timeout.
                    // http://jimhoskins.com/2012/12/17/angularjs-and-apply.html
                    setTimeout(function () {
                        if (chars.length == 12) {
                            var barcode = chars.join("");
                            $rootScope.scan = barcode;
                            $rootScope.$emit('notifying-service-event');
                        }
                        chars = [];
                        pressed = false;
                    }, 500);
                }
                pressed = true;
            });
        }
    };
}]);

在另一个JavaScript文件中调用函数，在setTimeout中调用函数，并使用AngularJS

1 个答案: