javascript - 集成非 Angular 代码？

Question

我正在开发一个 Cordova/PhoneGap 应用程序，并且使用 $cordovaPush 插件(包装为 PushPlugin)来处理推送通知。

代码看起来像这样:

var androidConfig = {
                    "senderID" : "mysenderID",
                    "ecb"      : "onNotification"
                }

                $cordovaPush.register(androidConfig).then(function(result) {
                    console.log('Cordova Push Reg Success');
                    console.log(result);            
                }, function(error) {
                    console.log('Cordova push reg error');
                    console.log(error);
                });

“ecb”函数必须在窗口范围内定义，即:

window.onNotification = function onNotification(e)...

该函数处理传入的事件。我显然想在我的 Angular 代码中处理传入事件 - 如何集成两者以便我的 onNotification 函数可以访问我的作用域/rootScope 变量？

Answer 1

通常，您会将第 3 方库包装在 service 或 factory 中，但本着回答您的特定场景的精神......

这是一种可能性:

angular.module('myApp').
   controller('myController', function($scope, $window) {
     $window.onNotification = function() {
       $scope.apply(function() {
         $scope.myVar = ...updates...
       });
     };
   });

需要注意的几件事:

• 尝试使用$window，而不是window。这是一个值得养成的好习惯，因为它将帮助您提高可测试性。由于 Cordova 的内部结构，您实际上可能需要使用 window，但我对此表示怀疑。
• 完成所有工作的函数都隐藏在 $scope.apply 中。 如果您忘记执行此操作，则您更新的任何变量都不会反射(reflect)在 View 中，直到摘要周期再次运行(如果有)。
• 虽然我将示例放在 Controller 中，但您也可以将示例放在处理程序中。如果它是一个 Angular 处理程序(例如 ng-click)，您可能会认为因为 ng-click 有一个隐式 $apply 包装回调，所以您的 当时并没有调用 onNotification 函数，因此您仍然需要执行 $apply，如上所述。
• ...说真的...别忘了申请。 :-) 当我调试人们的代码时，这是外部库无法工作的首要原因。我们都至少被咬过一次。