0

我正在用 angularJS 制作一个 phonegap 应用程序，但我的一个控制器内部的一个函数有问题。

我的控制器如下所示：

function NavCtrl($scope,navSvc) {

    $scope.slidePage = function (path,type) {
        navSvc.slidePage(path,type);
    };

    $scope.back = function () {
        navSvc.back();
    };

    $scope.scan = function(){
        console.log('scan(): init');
        var scanner = window.cordova.require("cordova/plugin/BarcodeScanner");

        scanner.scan(
            function (result) {
                if(result.cancelled == 1){
                    console.log("Scanner cancelado");
                }else{
                     console.log("scanner ok: " + result.text);
                     $scope.goTo(result.text); // /products/see/result.text
                }

            },
            function (error) {
                alert("Scanning failed: " + error);
            }
        );

    }

    $scope.goTo= function(barcode){
        console.log("Lets go to product " + barcode);
        $scope.slidePage('/products/see/'+barcode);
    }}

前两个函数是制作页面转换效果的函数。Scan功能是打开 phonegap 条码扫描器插件（并且工作正常）的功能，最后一个goTo功能是改变视图的功能。

期望的行为是，当有人打开条形码扫描时，用户会被重定向到与该扫描相关的产品。这里奇怪的是，当我扫描某些东西时，扫描功能内的控制台日志工作正常（它实际上说：Scanner ok: 58746987），但没有进行页面更改。但是，如果我再次打开条形码（所以我再次调用扫描功能），即使我没有扫描任何东西，我也会看到控制台日志（“让我们转到产品 XXX”，当 XXX 是之前扫描的正确条形码时）第二次， goTo 函数仅通过调用函数 scan 被触发。

是我实验过的奇怪的东西。这些功能可以正常工作，但我需要调用两次扫描才能完成重定向。

我也试过观察范围和根范围内的变量，但行为是一样的。

有什么提示吗？预先感谢。

4

1 回答 1

1

当像这样的第三方库一样工作时，您需要手动告诉 Angular 某些事情已经改变/发生了。

从文档中：

$apply() 用于从 Angular 框架外部执行 Angular 表达式。（例如来自浏览器 DOM 事件、setTimeout、XHR 或第三方库）。因为我们正在调用 Angular 框架，所以我们需要执行适当的异常处理范围生命周期，执行 watch。

所以替换：

$scope.goTo(result.text);

和：

$scope.$apply(function () {
    $scope.goTo(result.text);
});
于 2013-11-07T11:06:49.763 回答